jquery messageBox插件不能在IE7中工作

Question

我正在使用這個插件..但是這個插件http://jquerymsgbox.ibrahimkalyoncu.com/在IE7中不工作。

誰能幫我固定issue..Please告訴我什麼是問題..why這個插件是不是在IE7.Thanks工作提前

Answer 1

任何方式......這個問題在這裏解決的是更新的插件代碼...

/* 
jQuery.msgBox plugi-in 
Copyright 2011, Halil İbrahim Kalyoncu 
*/ 
jQuery.msgBox = msg; 
function msg (options) { 
    var isShown = false; 
    var typeOfValue = typeof options; 
    var defaults = { 
     content: (typeOfValue == "string" ? options : "Message"), 
     title: "Warning", 
     type: "alert", 
     autoClose: false, 
     timeOut: 0, 
     showButtons: true, 
     buttons: [{ value: "Ok"}], 
     inputs: [{ type: "text", name:"userName", header: "User Name" }, { type: "password",name:"password", header: "Password"}], 
     success: function (result) { }, 
     beforeShow: function() { }, 
     afterShow: function() { }, 
     beforeClose: function() { }, 
     afterClose: function() { }, 
     opacity: 0.1 
    }; 
    options = typeOfValue == "string" ? defaults : options; 
    if (options.type != null) { 
     switch (options.type) { 
      case "alert": 
       options.title = options.title == null ? "Warning" : options.title; 
       break; 
      case "info": 
       options.title = options.title == null ? "Information" : options.title; 
       break; 
      case "error": 
       options.title = options.title == null ? "Error" : options.title; 
       break; 
      case "confirm": 
       options.title = options.title == null ? "Confirmation" : options.title; 
       options.buttons = options.buttons == null ? [{ value: "Yes" }, { value: "No" }, { value: "Cancel"}] : options.buttons; 
       break; 
      case "prompt": 
       options.title = options.title == null ? "Log In" : options.title; 
       options.buttons = options.buttons == null ? [{ value: "Login" }, { value: "Cancel"}] : options.buttons; 
       break; 
      default: 
       image = "alert.png"; 
     } 
    } 
    options.timeOut = options.timeOut == null ? (options.content == null ? 500 : options.content.length * 70) : options.timeOut; 
    options = $.extend(defaults, options); 
    if (options.autoClose) { 
     setTimeout(hide, options.timeOut); 
    } 
    var image = ""; 
    switch (options.type) { 
     case "alert": 
      image = "alert.png"; 
      break; 
     case "info": 
      image = "info.png"; 
      break; 
     case "error": 
      image = "error.png"; 
      break; 
     case "confirm": 
      image = "confirm.png"; 
      break; 
     default: 
      image = "alert.png"; 
    } 

    var buttons = ""; 
    $(options.buttons).each(function (index, button) { 
     buttons += "<input class=\"msgButton\" type=\"button\" name=\"" + button.value + "\" value=\"" + button.value + "\" />"; 
    }); 

    var inputs = ""; 
    $(options.inputs).each(function (index, input) { 
     var type = input.type; 
     if (type=="checkbox" || type =="radio") { 
      inputs += "<div class=\"msgInput\">" + 
      "<input type=\"" + input.type + "\" name=\"" + input.name + "\" "+(input.checked == null ? "" : "checked ='"+input.checked+"'")+" value=\"" + (typeof input.value == "undefined" ? "" : input.value) + "\" />" + 
      "<text>"+input.header +"</text>"+ 
      "</div>"; 
     } 
     else { 
      inputs += "<div class=\"msgInput\">" + 
      "<span class=\"msgInputHeader\">" + input.header + "<span>" + 
      "<input type=\"" + input.type + "\" name=\"" + input.name + "\" value=\"" + (typeof input.value == "undefined" ? "" : input.value) + "\" />" + 
      "</div>"; 
     } 
    }); 

    var divBackGround = "<div class=\"msgBoxBackGround\"></div>" 
    var divTitle = "<div class=\"msgBoxTitle\">" + options.title + "</div>"; 
    var divContainer = "<div class=\"msgBoxContainer\"><div class=\"msgBoxImage\"><img src=\"../images/" + image + "\"/></div><div class=\"msgBoxContent\"><p><span>" + options.content + "</span></p></div></div>"; 
    var divButtons = "<div class=\"msgBoxButtons\">" + buttons + "</div>"; 
    var divInputs = "<div class=\"msgBoxInputs\">" + inputs + "</div>"; 

    if ($("div.msgBox").length == 0) { 
     if (options.type == "prompt") { 
      $("body").append(divBackGround + "<div class=\"msgBox\">" + divTitle + "<div>" + divContainer + (options.showButtons ? divButtons + "</div>" : "</div>") + "</div>"); 
      $("div.msgBoxImage").remove(); 
      $("div.msgBoxButtons").css({"text-align":"center","margin-top":"5px"}); 
      $("div.msgBoxContent").css({"width":"100%","height":"100%"}); 
      $("div.msgBoxContent").html(divInputs); 
     } 
     else { 
      $("body").append(divBackGround + "<div class=\"msgBox\">" + divTitle + "<div>" + divContainer + (options.showButtons ? divButtons + "</div>" : "</div>") + "</div>"); 
     } 
    } 
    else { 
     if (options.type == "prompt") { 
      $("div.msgBox").html(divTitle + "<div>" + divContainer + (options.showButtons ? divButtons + "</div>" : "</div>")); 
      $("div.msgBoxImage").remove(); 
      $("div.msgBoxContent").css("width", "100%"); 
      $("div.msgBoxContent").html(divInputs); 
     } 
     else { 
      $("div.msgBox").html(divTitle + "<div>" + divContainer + (options.showButtons ? divButtons + "</div>" : "</div>")); 
     } 
    } 

    var width = $("div.msgBox").width(); 
    var height = $("div.msgBox").height(); 
    var windowHeight = $(window).height(); 
    var windowWidth = $(window).width(); 

    var top = windowHeight/2 - height/2; 
    var left = windowWidth/2 - width/2; 

    show(); 

    function show() { 
     if (isShown) { 
      return; 
     } 
     $("div.msgBox").css({ opacity: 0, top: top - 50, left: left }); 
     $("div.msgBoxBackGround").css({ opacity: options.opacity }); 
     options.beforeShow(); 
     $("div.msgBoxBackGround").css({ "width": $(document).width(), "height": getDocHeight() }); 
     $("div.msgBox,div.msgBoxBackGround").fadeIn(0); 
     $("div.msgBox").animate({ opacity: 1, "top": top, "left": left }, 200); 
     setTimeout(options.afterShow, 200); 
     isShown = true; 
     $(window).bind("resize", function (e) { 
      var width = $("div.msgBox").width(); 
      var height = $("div.msgBox").height(); 
      var windowHeight = $(window).height(); 
      var windowWidth = $(window).width(); 

      var top = windowHeight/2 - height/2; 
      var left = windowWidth/2 - width/2; 

      $("div.msgBox").css({ "top": top, "left": left }); 
     }); 
    } 

    function hide() { 
     if (!isShown) { 
      return; 
     } 
     options.beforeClose(); 
     $("div.msgBox").animate({ opacity: 0, "top": top - 50, "left": left }, 200); 
     $("div.msgBoxBackGround").fadeOut(300); 
     setTimeout(function() { $("div.msgBox,div.msgBoxBackGround").remove(); }, 300); 
     setTimeout(options.afterClose, 300); 
     isShown = false; 
    } 

    function getDocHeight() { 
     var D = document; 
     return Math.max(
     Math.max(D.body.scrollHeight, D.documentElement.scrollHeight), 
     Math.max(D.body.offsetHeight, D.documentElement.offsetHeight), 
     Math.max(D.body.clientHeight, D.documentElement.clientHeight)); 
    } 

    function getFocus() { 
     $("div.msgBox").fadeOut(200).fadeIn(200); 
    } 

    $("input.msgButton").click(function (e) { 
     e.preventDefault(); 
     var value = $(this).val(); 
     if (options.type != "prompt") { 
      options.success(value); 
     } 
     else { 
      var inputValues = []; 
      $("div.msgInput input").each(function (index, domEle) { 
       var name = $(this).attr("name"); 
       var value = $(this).val(); 
       var type = $(this).attr("type"); 
       if (type == "checkbox" || type == "radio") { 
        inputValues.push({ name: name, value: value,checked: $(this).attr("checked")}); 
       } 
       else { 
        inputValues.push({ name: name, value: value }); 
       } 
      }); 
      options.success(value,inputValues); 
     } 
     hide(); 
    }); 

    $("div.msgBoxBackGround").click(function (e) { 
     if (!options.showButtons || options.autoClose) { 
      hide(); 
     } 
     else { 
      getFocus(); 
     } 
    }); 
}; 

//function msg (content, title, type) { 
// msg({content:content,title:title,type:type}); 
//} 

與IE7，IE8，Firefox的測試9 .. 重要教訓：插件前面的代碼試圖創建的HTML標籤新的消息框格。由於某些原因IE7沒有顯示HTML標記的直接子節點的消息框div。我已經改變了插件代碼來創建body標籤中的消息框div而不是html標籤，所以現在插件在IE7，IE8，Firefox9中正常工作。