将自定义方法添加到UI对话框插件

我正在使用jQuery的UI对话框，我想添加一个自定义方法。

基本上当我的对话框有一个“工作”类时，它有一个加载覆盖。 我正在尝试编写一些全局应用程序jQuery，以便在任何对话框关闭时，它会删除类“工作”。

我不确定我在做什么，但这是我到目前为止所做的：

(function ($) { // BIND TO DIALOG CLOSE EVENT $('.ui-dialog').live('dialogclose', function() { $(this).dialog('cancelWorking'); }); // CUSTOM METHOD $.fn.dialog.cancelWorking = function() { $(this).removeClass('working'); }; }(jQuery)); 

正如你所看到的，我不确定如何调用对话框的cancelWorking方法，我不确定我是否已经正确定义了该方法。

Answer 1

正如我的评论中提到的，您可以从插件inheritance并扩展其方法。

 (function($,undefined) { $.widget('ui.mydialog', $.ui.dialog,{ test : function() { alert('works') }, }); $.extend($.ui.mydialog,{version:'v0.1'}); })(jQuery); 

简单地使用它：

 $('.selector').mydialog({modal:true}); //Create (same as a dialog) $('.selector').mydialog('test'); //Call extended method 

此模式允许您添加其他输入选项，方法，事件等，以及重载或扩展父插件中提供的function。

还应该提到这很好，因为您仍然可以使用常规插件而无需在UI中的其他位置进行任何修改。

Answer 2

我想做同样的事情，但对接受的答案不满意。 我进一步了解它，发现你可以这样新的方法：

 $.ui.dialog.prototype.toggleProcessing = function(enable) { alert(((enable) ? 'en' : 'dis') + 'able processing'); } 

然后你可以在调用任何其他jQuery UI方法时调用它：

 $('#myDialog').dialog('toggleProcessing', true); $('#myDialog').dialog('toggleProcessing', false);