Question

我有一个jQuery UI小部件，它附加到div，然后侦听其中的特定控件（通过选项设置）。问题是在我的事件监听器中，这是指更改的控件，而不是窗口小部件附加到的元素。那么如何访问widget元素呢？

    _addressChanged: function () {
        $(this).data("address").requiresValidation = true;
    },

    _bindEventHandlers: function () {
        $(this.options.address1).bind("change", this._addressChanged);
        $(this.options.address2).bind("change", this._addressChanged);
        $(this.options.city).bind("change", this._addressChanged);
        $(this.options.zip).bind("change", this._addressChanged);
    },

Answer 1

使用this._on() method绑定处理程序。此方法由jQuery UI小部件工厂提供，并将确保在处理程序函数中this始终引用小部件实例。

_bindEventHandlers: function () {
    this._on(this.options.address1, {
        change: "_addressChanged" // Note: pass the function name as a string!
    });
    ...
},
_addressChanged: function (event) {
    // 'this' is now the widget instance.
    // 'this.element', as suggested by sjsharktank, is the DOM element the widget was created on
},

Answer 2

您是否尝试过this.element？

来自http://wiki.jqueryui.com/w/page/12138135/Widget%20factory：

<强> this.element

用于实例化插件的元素。例如，如果您要执行$( "#foo" ).myWidget()，那么在您的窗口小部件实例this.element内部将是一个包含id为foo的元素的jQuery对象。如果选择多个元素并在集合上调用.myWidget()，则将为每个元素实例化一个单独的插件实例。换句话说，this.element将始终只包含一个元素。

JQuery UI和事件处理

2 个答案: