Question

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

我尝试过将widget变量设置为小部件：

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

我也试过通过jQuery抓取小部件的上下文，如：

$.widget("my.widget")

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

Answer 1

在widget方法中，您可以通过'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;
    }

});

Answer 2

如前所述，this是从窗口小部件调用窗口小部件功能的最常用方法。

在您的示例中，执行此操作没有意义：

_widget: this

因为你需要上下文来获取_widget变量。

有时无法将环境保存在易于访问的位置，例如在不直接来自窗口小部件的事件上创建事件处理程序时。

来自Learning To Use the Widget Factory

如果您可以从event.target实例或控件的id获取控件，则可以在jQuery对象上调用.data（）函数，并传递窗口小部件的名称。但是，在窗口小部件的名称中使用短划线而不是点。

var $control = $('#' + myControlId);
var $widget = $control.data("my-widget");
$widget.getFoo();

jQuery UI Widget Factory获取当前小部件的上下文

2 个答案: