jQuery UI – 覆盖插件方法

我在jQuery UI中无法掌握OOP，关于我曾经使用过的经典OOP。

据我所知，我创建了一个名为“modal”的新插件（widget），它扩展了UI对话框小部件。 现在我如何覆盖对话框的close()方法，还调用原始方法，以便我不会失去其function？

 $.widget('ui.modal', $.ui.dialog, { close: function() { // How do I do something to the current modal DOM object? // Is this correct? $(this).addClass('test'); // Then call the parent close() method to keep all original // functionality of dialog.close() // ??? } }); $.extend($.ui.modal); 

Answer 1

当你有一个可以挂钩的关闭事件时，为什么要用新的关闭函数覆盖$ .ui.dialog？ 查看以下链接中的“事件”选项卡：

http://jqueryui.com/demos/dialog/#modal

页面中的代码示例：

提供一个回调函数来处理close事件作为init选项。

 $( ".selector" ).dialog({ close: function(event, ui) { ... } }); 

通过类型绑定到close事件：dialogclose。

 $( ".selector" ).bind( "dialogclose", function(event, ui) { ... }); 

编辑

回答这个问题：

 (function($){ var dialogExtensions ={ oldClose: $.ui.dialog.prototype.close, close: function(event){ this.oldClose(event); // custom code } }; $.extend($.ui.dialog.prototype, dialogExtensions); })(jQuery); 

Answer 2

这是我发现的一个例子。 我发现它清楚有用：

 // If you dont need to call original method $.widget("ui.addresspicker", $.extend({}, $.ui.addresspicker.prototype, { _updatePosition: function(){ // Do what you want to } })); // If you need to call original method var orig_updatePosition = $.ui.addresspicker.prototype._updatePosition; $.widget("ui.addresspicker", $.extend({}, $.ui.addresspicker.prototype, { _updatePosition: function(){ // Do what you want to // Call original widget method orig_updatePosition.apply(this, arguments); } })) 

Answer 3

我不确定jQuery UI。 真的不喜欢它。

但是你认为你可以做这样的事情。

 $.widget('ui.modal', $.ui.dialog, { close: function() { $(this).addClass('test'); $.ui.dialog.close.call(this, arguments); // Using method call to call the original close method from dialog // The sweet thing about call is you can pass this to it. // Sending any arguments you maybe get from the function initialize. close('argument 1', 'argument 2', etc...) } }); $.extend($.ui.modal); 

安德烈亚斯