Javascript 对话框 (遇到 Ajax Load无法加载问题）

一个弹框公共组件，实现类似Discuz! 的登入效果。

/*
文档名称： 无模式对话框弹出组件

*/

//               HTML文本  宽度     高度     绑定关闭    
function sAlert(htmlStr,msgWidth,msgHeight,closeid){
   //alert(htmlStr);
   var msgw,msgh; 
   msgw=msgWidth!=null?msgWidth:400;//Width
   msgh=msgHeight!=null?msgHeight:100; //Height

   var sWidth,sHeight;   //遮罩大小
   sWidth=document.body.clientWidth; 
   sHeight= document.body.clientHeight;  //screen.height; 
   
   //创建覆盖层
   var bgObj=document.createElement("div");  
   bgObj.setAttribute('id','bgDiv'); 
   bgObj.style.position="absolute"; 
   bgObj.style.top="0"; 
   bgObj.style.background="#000";  //黑色
   bgObj.style.filter="progid:DXImageTransform.Microsoft.Alpha(style=4,opacity=25,finishOpacity=75"; 
   bgObj.style.opacity="0.6"; 
   bgObj.style.left="0"; 
   bgObj.style.width=sWidth + "px"; 
   bgObj.style.height=sHeight + "px"; 
   bgObj.style.zIndex = "10000"; 
   //bgObj.onclick = cAlert();
   document.body.appendChild(bgObj); 
   //覆盖层 END
   
   //创建消息框
   var msgObj=document.createElement("div");
   
   msgObj.setAttribute("id","msgDiv"); 
   //msgObj.setAttribute("align","center");
   //msgObj.style.overflow = "hidden";
   //msgObj.style.background="white"; 
   //msgObj.style.border="1px solid #666666";
   msgObj.style.position = "absolute"; 
   msgObj.style.left = ((document.documentElement.clientWidth/2-msgw/2)+document.documentElement.scrollTop).toString()+"px";
   msgObj.style.top = ((document.documentElement.clientHeight/2-msgh/2)+document.documentElement.scrollTop).toString()+"px";
   //msgObj.style.font="12px/1.6em Verdana, Geneva, Arial, Helvetica, sans-serif"; 
   //msgObj.style.marginLeft = "-225px" ; 
   //msgObj.style.marginTop = -75+document.documentElement.scrollTop+"px"; 
   msgObj.style.width = msgw + "px"; 
   msgObj.style.height =msgh + "px"; 
   //msgObj.style.textAlign = "center"; 
   //msgObj.style.lineHeight ="25px"; 
   msgObj.style.zIndex = "12000"; 
   document.body.appendChild(msgObj); 
   document.getElementById("msgDiv").innerHTML=htmlStr; 
   document.getElementById("bgDiv").onclick = function(){cAlert();}
   try{//处理未绑定异常
      document.getElementById(closeid).onclick = function(){cAlert();}
   }
   catch(error){
      alert("ERROR");
   }
}

function cAlert()
{
   document.body.removeChild(document.getElementById("bgDiv")); 
   document.body.removeChild(document.getElementById("msgDiv")); 
}

 

在火狐下，遇到了无法弹出的问题，导致问题产生的原因是Load方法未执行完成，就去调用其结果。

将调用过程放到  回调函数里面就OK~~

 

 var $html = $("<div id=\"temphtmlNodete\" style=\"display:none;\"></div>");
           $.ajaxSetup ({cache: false }); 
           $html.load("密码找回.html",function(){
                               sAlert($html.html(),750,400,"close");
                                               }