使用重新定义的父方法在Jquery UI中扩展窗口小部件

Question

我尝试根据文档(UI版本1.8.16)扩展UI对话框:

(function($) {
    $.widget('ui.mydialog', $.extend(true, $.ui.dialog.prototype, {
        _create: function() {
            return $.Widget.prototype._create.apply(this, arguments);
        }
    }));
})(jQuery);

$(function() {
    $('div#dialog').mydialog();
});

执行此代码会导致JS错误:"this.uiDialog is undefined".

如果尝试覆盖_init()方法没有错误,但父方法调用不起作用.

我很困惑.扩展的哪种方式合法,例如放一些自定义初始化代码？

Answer 1

我认为这篇文章将解决您的问题:从jQuery UI对话框继承并调用重写方法.

简而言之,如果您想构建一个继承jQuery UI Dialog的小部件,您可以这样做:

(function($) {
    $.widget("ui.mydialog", $.ui.dialog, {
        _create: function() {
            $.ui.dialog.prototype._create.call(this);
        }
    });

})(jQuery);

请参阅此操作:http://jsfiddle.net/william/RELxP/.

本教程将启发您:http://wiki.jqueryui.com/w/page/12138135/Widget%20factory.简而言之,$.Widget是基本小部件对象.即使它有一个_create函数,它默认也不做任何事情,将初始化代码留给子类.看一下这个更新的例子:http://jsfiddle.net/william/RELxP/1.

Answer 2

从 jQuery 1.9 及更高版本开始，如果您想向小部件添加功能并且不想替换现有功能，请在编写代码后调用父方法。为此，您可以简单地执行以下操作，而不是 William Niu 的建议：

_create: function()
{
    // Custom code here

    // Call the _create method of the widget
    this._super();
}

这适用于所有现有方法。（例如_setOption，_trigger等等）