初始化后无法应用JqueryUI可resize的AspectRatio？

我试图在JQueryUI中动态地打开/关闭宽高比，但是即使将选项设置为false，它仍然保持宽高比。 以下是我目前正在使用的代码：

$('#aspect_check').click( function() { var ischecked = $('#aspect_check').prop('checked'); if (ischecked) { $( "#resizable" ).resizable( "option", "aspectRatio", .75); } else { $( "#resizable" ).resizable( "option", "aspectRatio", false ); } }); 

我发现了一个3年前的错误报告，看起来它仍然没有得到修复，尽管标记它至关重要。 http://bugs.jqueryui.com/ticket/4186

解决方法不适用于最新版本。 有任何想法吗？

编辑：经过大量的错误报告后，这是一个解决方法：

 $(function() { $.extend($.ui.resizable.prototype, (function (orig) { return { _mouseStart: function (event) { this._aspectRatio = !!(this.options.aspectRatio); return(orig.call(this, event)); } }; })($.ui.resizable.prototype["_mouseStart"])); }); 

将其粘贴到您的JavaScript脚本部分。 希望它可以帮助有类似问题的人！

Answer 1

这对我来说没有修补

 $('#resizable') .resizable('option', 'aspectRatio', false) .data('uiResizable')._aspectRatio = false; 

这部分.data('uiResizable')._aspectRatio = false; 来救援

Answer 2

我不知道它是否会起作用或将会发生什么。 但你可以尝试这样的事情。

 $(function(){ var settings = { aspectRatio : .75 }; $("#tadaa").resizable(settings); $("input").change(function(){ if($(this).is(":checked")) { $("#tadaa").resizable( "destroy" ); $("#tadaa").resizable(); } else { $("#tadaa").resizable( "destroy" ); $("#tadaa").resizable(settings); } }); }); 

现场演示，目前只有底部可拖动元素的样式使用，水平div没有样式。

http://jsfiddle.net/t6xFN/1/

Answer 3

我意识到这是一个老post，但万一有人还需要答案，你可以这样做：

 $('#aspect_check').click( function() { var ischecked = $('#aspect_check').prop('checked'); if (ischecked) { $( "#resizable" ).resizable({aspectRatio : .75}); } else { $( "#resizable" ).resizable(); } }); 

Answer 4

另一种解决方案是在变量中保存可resize的选项，并使用更新的选项销毁和重新初始化小部件：

 var options = $("#resizable").resizable("options"); if (ischecked) { options.aspectRatio = .75; } else { options.aspectRatio = false; } $("#resizable").resizable("destroy"); $("#resizable").resizable(options);