jQuery Widget Factory _trigger实例

时间:2012-10-25 04:10:32

标签: javascript jquery jquery-ui jquery-ui-widget-factory

当使用_trigger方法来触发事件时,我遇到了一个障碍,我一直在打,但没能正确掌握。

基本上,如果我的窗口小部件有多个实例,则在同一页面上实例化的最后一个窗口小部件优先于所有其他窗口小部件。

我已经学会并成功使用$ .extend来创建一个对实例唯一的对象,但我对如何处理以下问题感到困惑:

如何正确使用_trigger方法,以便在每个实例的基础上启用它。

(function($) {
  $.widget("a07.BearCal", {
    options: {  },
    _create: function() {
        _this = this;
        this.element.click(function() {
            _this._trigger("testTrig");
        });
    },
  });
})(jQuery);

// Instantiate widget on .full
$('.full').BearCal({
    testTrig: function() {
        console.log("testTrig event: full");
    }
});

// Instantiate widget on .mini
$('.mini').BearCal({
    testTrig: function() {
        console.log("testTrig event: mini");
    }
});

此处示例:http://jsfiddle.net/NrKVP/13/

1 个答案:

答案 0 :(得分:6)

你有一个偶然的全局变量:

_this = this;

这意味着插件的两个实例都将this置于构造函数中的相同(全局)_this中。结果是所有插件实例都使用this作为最后一个绑定。你想要这个:

var _this = this;

演示:http://jsfiddle.net/ambiguous/9NQNz/