從外部部件

這是一個簡單的小工具模擬訪問控件實例：從外部部件

(function ($) { 

    $.widget("ui.myDummyWidget", { 

     options: { 
     }, 

     _create: function() { 
     }, 
     hide: function() { 
      this.element.hide(); 
     }, 
     _setOption: function (key, value) { 
      $.Widget.prototype._setOption.apply(this, arguments); 
     }, 

     destroy: function() { 
      $.Widget.prototype.destroy.call(this); 
     } 

    }); 

} (jQuery));

它只是增加了一個方法隱藏，您可以調用隱藏的元素。很容易，只要從窗口小部件

this.hide();

內完成，但一個常見的情況是，你想打電話從外面上的小工具實例方法（阿賈克斯更新，或其他外部事件）

那麼，什麼是最好的方法訪問小部件實例？一種方法是將引用添加到窗口小部件的元素，醜陋...

_create: function() { 
    this.element[0].widget = this; 
},

然後你可以從外面做

this.dummy = $("#dummy").myDummyWidget(); 
this.dummy[0].widget.hide();

來源

2011-12-14 Anders

小部件引擎已經訪問你想要做什麼：它調用data()內部的部件及其各自的關聯要素：

$("#dummy").myDummyWidget(); 
// Get associated widget. 
var widget = $("#dummy").data("myDummyWidget"); 
// The following is equivalent to $("#dummy").myDummyWidget("hide") 
widget.hide();

更新：從jQuery UI 1.9開始，the key becomes the widget's fully qualified name, with dashes instead of dots。因此，上面的代碼變成：

// Get associated widget. 
var widget = $("#dummy").data("ui-myDummyWidget");

使用不合格的名稱仍支持的1.9，但不建議，並支持將在1.10被丟棄。

來源

2011-12-14 15:04:03

謝謝！數據不是一個很好的名字：D但它的工作原理，這是重要的部分：P – Anders 2011-12-14 15:13:54

您還可以使用jQuery自定義選擇器在調用它們上的數據以查找實際的窗口小部件實例之前查找窗口小部件元素，例如

$(this.element).find(":ui-myDummyWidget").each(function (index, domEle) { 
    var widgetObject = $(this).data("myDummyWidget"); 
    widgetObject.hide(); 
    // this == domEle according to the jQuery docs 
});

該代碼查找所有ui.myDummyWidget的情況下（注意時間段的變化連字符 - ）的已創建並連接到其他窗口的持有人。

來源

2012-06-25 10:45:09 Danack

我不知道在哪個版本據介紹，但是，如果你希望做的是調用控件的方法，你可以這樣做：

$("#myWidget").myDummyWidget("hide");

凡進myWidget是DOM的id元素持有你的小部件的一個實例。這將調用隱藏方法。

如果您需要調用需要的方法參數，你可以在方法名稱後通過他們，就像這樣：

$("#myWidget").myDummyWidget("setSpecialAnswer",42);

此外，你可以看看使用特殊選擇小部件的所有實例：widgetName及其調用方法。以下代碼片段將調用所有myDummyWidget小部件上的隱藏方法。

該部件全名是由（在本例中「UI」）的前綴的

$(":ui-myDummyWidget").myDummyWidget("hide");

頭腦和得分（「 - 」）分隔的小部件的名稱（「myDummyWidget」）。

您應該爲自定義小部件使用自己的前綴; 「ui」通常保留給jQueryUI預構建的小部件。

我希望有幫助。 :)

來源

2016-02-08 13:47:24 Pittigghio

還有創建定義Widget的時候，你可以簡單地調用instance方法來獲取實際的小部件實例，像這樣的方法：

//Create the Instance 
$("#elementID").myDummyWidget(options); 

//Get the Widget Instance 
var widget = $("#elementID").myDummyWidget("instance");

或者你也可以做到這一點作爲一個單襯裏：

var widget = $("#elementID").myDummyWidget(options).myDummyWidget("instance");

來源

2017-09-29 09:37:36

回答

相關問題