javascript - 允许调用函数覆盖默认选项 - jQuery UI 对话框

标签 javascript jquery jquery-ui inversion-of-control

我希望 CallingFunction 能够覆盖 showDivPopUp 函数中提供的默认选项。

function calling(){
  showDivPopUp("title of pop up box", "message to show", 
        {
            buttons:{
                        Yes: function () {
                                $(this).dialog("destroy");
                            },
                        No :function () {
                                $(this).dialog("destroy");
                            }                        
                    }      
        });
}

function showDivPopUp(title,msg,options){
  var mgDiv = $("#msgDiv");
  mgDiv.attr("innerHTML", msg);
  return mgDiv.dialog({
    modal: true,
    buttons: {
      Ok: function () {
        $(this).dialog("destroy");
      }
    },
    resizable: true,
    show: "explode",
    position: "center",
    closeOnEscape: true,
    draggable: false,
    title : titl,
    open: function (event, ui) { $(".ui-dialog-titlebar-close").hide(); }
  });
}

所以,上面的代码应该显示两个按钮,即。 ,而不仅仅是确定。我不想对每个选项都进行 if 检查。

更新:
在选项参数中,可能存在不应用默认值的选项。因此调用函数可能会指定 size 选项,而该选项在 showDivPopUp 函数中未提及。

最佳答案

您想要使用 JQuery Extend() 方法将传递到函数中的选项与函数中指定的默认值合并。

参见: http://www.zachstronaut.com/posts/2009/05/14/javascript-default-options-pattern.htmlhttp://api.jquery.com/jQuery.extend/

//calling function source excluded, use exactly the same.

function showDivPopUp(title, msg, options) {

    //create basic default options
    var defaults = {
        modal: true,
        buttons: {
            Ok: function() {
                $(this).dialog("destroy");
            }
        },
        resizable: true,
        show: "explode",
        position: "center",
        closeOnEscape: true,
        draggable: false,
        title: title,
        open: function(event, ui) { $(".ui-dialog-titlebar-close").hide(); }
    }

    //merge the specified options with the defaults.
    //in example case, will have the above except with the new buttons specified
    if (typeof options == 'object') {
        options = $.extend(defaults, options);
    } else {
        options = defaults;
    }


    var mgDiv = $("#msgDiv");
    mgDiv.attr("innerHTML", msg);
    return mgDiv.dialog(options); 
}

关于javascript - 允许调用函数覆盖默认选项 - jQuery UI 对话框,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/4756193/

相关文章:

javascript - 替换字符串的最后一个字符

javascript - 从在线文件中获取Json文档数据

javascript - 在 JavaScript 中覆盖 "private"函数

html - Xslt jqueryui未使用的div

javascript - 删除 HTML 标签并考虑文本区域中的换行符

javascript - angularjs中的ng-grid和ui-grid有什么区别

javascript - Jquery 添加椭圆 (...) 并根据高度而非宽度 chop 文本

javascript - 在 Fullcalendar eventAfterAllRender 之后执行函数

javascript - Rails 4 - 使用脚本变量作为按钮值

javascript - 超链接图像未显示在 Chrome 扩展程序上