对于我习惯的经典 OOP,我在掌握 jQuery UI 中的 OOP 时遇到了困难。
据我所知,我创建了一个名为“modal”的新插件(小部件),它扩展了 UI 对话框小部件。现在,如何重写对话框的 close()
方法,同时调用原始方法,这样我就不会失去其功能?
$.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);
最佳答案
当 $.ui.dialog 有一个可以 Hook 的关闭事件时,为什么要使用新的关闭函数覆盖 $.ui.dialog ?查看以下链接中的事件选项卡:
http://jqueryui.com/demos/dialog/#modal
页面中的代码示例:
提供回调函数来处理关闭事件作为 init 选项。
$( ".selector" ).dialog({
close: function(event, ui) { ... }
});
通过类型绑定(bind)到关闭事件: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);
关于jQuery UI - 覆盖插件方法,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/7255921/