如何从按钮单击功能访问其他小部件属性？

【问题标题】：How to access other widget properties from button click function?如何从按钮单击功能访问其他小部件属性？
【发布时间】：2014-04-15 17:24:19
【问题描述】：

我有一个简单的小部件，只有一个按钮和一些属性和功能。如何在单击按钮时访问这些功能。

(function ($, undefined) {
$.widget("test", {

    _create: function () {

        var pButton = this.element;
        pButton.button();
        pButton.css({ width: this.options.buttonWidth });

        pButton.click(function () { this.function_test(); });



    },
    function_test: function ()
    {
        alert("aa");
    }

});
}(jQuery));

【问题讨论】：

标签： jquery jquery-widgets

【解决方案1】：

问题在于 click() 函数中的按钮对象无法直接访问小部件创建者。有很多方法可以解决这个问题。我建议您使用 this._on 而不是 pButton.click 绑定点击回调，例如替换：

pButton.click(function () { this.function_test(); });

与：

this._on(pButton, {
    click: function () { this.function_test(); }
});

现在click 回调中的this 对象是小部件实例，而不是按钮，因此您可以调用小部件的函数。

你可以在这里测试它：http://jsbin.com/yorunaji/1/edit?html,js,output

【讨论】：