2

使用 jQuery UI 小部件工厂模式创建小部件后,是否存在对小部件本身的全局引用?

我尝试过设置一个与小部件相等的小部件变量:

$.widget("my.widget", {
  _widget: this,
  _create: function () {
    // _widget should == the whole widget
  }
});

我还尝试通过 jQuery 获取小部件的上下文,例如:

$.widget("my.widget")

我无法弄清楚您应该如何在小部件内部回调小部件。

4

2 回答 2

2

在小部件方法中,您通过“this”关键字引用实例:

$.widget('my.widget', {
    foo: true,
    _create: function () {
        var foo = this.getFoo();
    },
    getFoo: function () {
        return this.foo;
    }

});

如果你在一个方法中发现上下文发生了变化(在编写 jQuery 时经常发生这种情况),那么你可以只在本地 var 中存储对“this”的引用:

$.widget('my.widget', {
    foo: true,
    _create: function () {
        var self = this;
        this.element.click(function () {
            var foo = self.getFoo();
        });
    },
    getFoo: function () {
        return this.foo;
    }

});
于 2012-05-02T00:22:42.687 回答
1

如前所述,this是从小部件调用小部件功能的最常见方式。

在您的示例中,这样做没有意义:

_widget: this

因为您已经需要上下文才能访问 _widget 变量。

有时不可能将上下文保存在易于访问的位置,例如在不是直接来自小部件的事件上创建事件处理程序时。

学习到使用小部件工厂

如果可以从event.target实例或控件的 id 获取控件,则可以在 jQuery 对象上调用 .data() 函数,并传递小部件的名称。但是,在小部件的名称中使用破折号而不是点。

var $control = $('#' + myControlId);
var $widget = $control.data("my-widget");
$widget.getFoo();
于 2016-02-27T16:52:46.787 回答