0

作为从 jQuery 1.6.4 升级到 1.9.x 的一部分,我试图了解如何使用 jQuery 小部件桥来允许访问作为独立对象创建的小部件的函数,而不是作为 jQuery 的扩展。

所有示例(例如这个示例)都使用原型函数作为对象的源定义,这似乎没有映射为直接从基于 {} 的定义定义对象。

例如,我正在定义一个这样的小部件:

var ControlPanel = {

    instance: null,

    options: {
        //Some options here
    },

    simpleFunction: function(){
        alert("I am a function");
    },

    _init: function() {
        //Some init stuff here
    }
}

$.widget("basereality.controlPanel", ControlPanel); // create the widget

//This doesn't appear to work...
$.widget.bridge('controlPanel', $.basereality.controlPanel); //'Bridge' the widget

然后通过执行以下操作创建它的实例:

var controlPanelParams = {
  // some options go here
};

var newControlPanel = $('#controlPanel').controlPanel(controlPanelParams);

我现在希望能够在创建的对象上调用方法“simpleFunction”,我尝试这样做:

newControlPanel.simpleFunction();
//and 
$(newControlPanel).simpleFunction();

两者都给出“对象没有称为 simpleFunction 的方法”错误。

那么我做错了什么,你打算如何在基于非功能的对象上使用 $.widget.bridge ?

4

1 回答 1

0

我想我已经想通了。而不是这个:

$(newControlPanel).addControl(smartyControlPanel);

通过将其作为参数调用来访问该函数,如下所示:

newControlPanel.controlPanel("addControl", smartyControlPanel);

而且我还将我的代码转换为基于第一个原型的函数:

var ControlPanel = function(options, element){
    this.options = options;
    this.element = element;

    this._init();
};

ControlPanel.prototype = {
    //Everything else in here
}

尽管必须将其作为参数调用比直接将其作为函数调用要容易理解得多。

于 2013-02-05T10:44:29.940 回答