javascript - jQueryUI Resizable 对选项更改没有响应

Question

我使用 jQuery UI Resizable 模块，当我在初始化后尝试传递一个选项时，它看起来没有反应。

所以如果我初始化元素：

$('.blabla').resizable();

然后尝试添加选项：

$('.blabla').resizable("option","aspectRatio",true);

什么都没发生。通过逐个检查选项，我发现其中一些有效，而另一些无效……有什么问题？当然，'aspectRatio' 不起作用，而'ghost' 起作用。

这是简单的jsfiddle：http: //jsfiddle.net/k8gY8/1/

Answer 1

这似乎是一个已知问题：http ://bugs.jqueryui.com/ticket/4186

因此，按照建议，您可以覆盖原型mouseStart事件：

$(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"]));
});

在您的代码顶部， il 将起作用。

演示：http: //jsfiddle.net/ajYgM/

Answer 2

Jquery UI 中有一个错误。特别是，那个已经快 5（五！！！）岁了，并且在 jquery ui 论坛上被多次报道。这是票： http ://bugs.jqueryui.com/ticket/4186

当前的解决方法是这样的：

(function() {
    var oldSetOption = $.ui.resizable.prototype._setOption;
    $.ui.resizable.prototype._setOption = function(key, value) {
        oldSetOption.apply(this, arguments);
        if (key === "aspectRatio") {
            this._aspectRatio = !!value;
        }
    };
})();