jQuery UI - 覆盖插件方法

标签 jquery jquery-ui jquery-ui-dialog

对于我习惯的经典 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/

相关文章:

jquery - 使用 JQuery 查找所有文本字段

ruby-on-rails - getScript jQuery 路径不起作用/Ruby on Rails

jQuery Cycle2 图像在 Firefox 中不显示

javascript - Highcharts : How to prevent the "flashback" in animation?

javascript - 如何去除实体压力表下方的空白空间?

jQuery 用户界面 : How to use ui-widget-overlay by itself?

javascript - Jquery 拖动会在 mousemove 上触发,但不会在 mousedown 上触发

javascript - 扩展 jquery ui 小部件 - 如何访问父事件

jquery - 获取 jQuery UI 选项卡中的当前选项卡

jquery - 当我关闭对话框时,有没有办法以编程方式强制 jquery select2 下拉菜单消失?