1

作成後にjQueryウィジェットで深くネストされたオプションを変更する最良の方法は何ですか?

$.widget("test.widget1", {
    options: {
        deepOption: {
            prop1: false,
            prop2: false
        }
    },
    _create: function() {

    },
    _init: function () {
        this.element.append('<br>' + this.options.deepOption.prop1 + " " + this.options.deepOption.prop2);
    }
})
$("#one").widget1();

$("#one").widget1({
    deepOption: {
        prop1: true
    }
});​

上記のコードは、prop1オプションを true および nukes に変更しますprop2。prop1を保存したまま変更するにはどうすればよいですかprop2。

これは jsFiddle です。

編集： 解決策を思いつきましたが、ハックのようなものです。これは私がやろうとしていることを行うための最良の方法ですか?

$.widget("test.widget1", {
    options: {
        deepOption: {
            prop1: false,
            prop2: false
        }
    },
    _create: function() {

    },
    _init: function () {
        this.element.append('<br>' + this.options.deepOption.prop1 + " " + this.options.deepOption.prop2);
    },
    _setOption: function (key, value) {
        switch(key) {
            case 'deepOption':
                value = $.extend({}, this.options.deepOption, value);                
                break;            
        }

        $.Widget.prototype._setOption.apply(this, arguments);
    }
})
$("#one").widget1();

$("#one").widget1({
    deepOption: {
        prop1: true
    }
});​

更新された jsFiddle は次のとおりです。

4

1 に答える 1

1

changelog.option()で説明されているように、部分的にネストされたオプションの設定をサポートするために、jQuery UI 1.9 で拡張されました。

ウィジェットの作成後にそのようなオプションを変更するには、次を使用できるようになりました。

$("#one").widget1('option', 'deepOption.prop1', true);

jsFiddle

于 2014-02-17T23:27:36.917 に答える