调用扩展jquery小部件的方法

Question

我有一个jquery小部件，如下所示：

$.widget("ui.MyWidget", {
              options: {            
            Value1: 10,
            Value1: 20,
        },
// and other methods like _create,...
});

而且，我这样扩展它：

$.widget("ui.MyExtWidget", $.extend({
            options: {
            Value3: 20,
        }}, $.ui.MyWidget.prototype, {
        myNewMethod: function(){
            alert(this.options.Value1+this.options.Value3);
        }
}

我必须调用html中的"myNewMethod"。

我的html代码是这样的：

$("#Div1").MyExtWidget();
$("#Div1").MyExtWidget("myNewMethod");

我在使用上面的代码时遇到了这样的异常无法在初始化之前调用TimeSpanHeader上的方法；试图调用方法"myNewMethod"

调用"myNewMethod"方法的方法是什么？

Answer 1

窗口小部件工厂提供了一种从现有窗口小部件扩展$.widget构造函数的方法：

$.widget("ui.MyExtWidget", $.ui.MyWidget, {
    options: {
        alertText: ''
    },
    myNewMethod: function() {
        alert('Value1 = ' + this.options.Value1);
        alert('alertText = ' + this.options.alertText);
    }
});

注意：构造函数也将负责扩展选项。这是jQuery UI库本身使用的方法。例如，小部件ui.mouse有选项，许多其他小部件从中继承，并有自己的额外选项以及ui.mouse.中的选项

演示

---

来自Widget Factory wiki文章：

小部件工厂是全局jQuery对象上的一个简单函数-jQuery.widget-接受2或3个参数。

jQuery.widget（"namespace.widgetname"，/*可选-从/继承的现有小部件原型，/成为小部件原型的对象文字*/｛…｝）；

第二个（可选）参数是要从继承的小部件原型。例如，jQueryUI有一个"鼠标"插件交互插件是基于的。为了实现这一点，可丢弃等都是从鼠标插件继承的，如下所示：jQuery.widget（"ui.draggable"，$.ui.house，｛…｝）；如果没有如果提供此参数，小部件将直接从"base"继承小部件，"jQuery.widget"（注意小写字母"w"之间的区别jQuery.widget和大写"W"jQuery.widget）。