zoukankan      html  css  js  c++  java
  • 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");
    }
  • 相关阅读:
    WPF Timer替代者
    <转>Change the Background of a selected ListBox Item
    WPF Button样式模板
    WPF中自定义只能输入数字的TextBox
    ansible playbook模式及语法
    数据挖掘Kaggle
    电影网站
    数据挖掘面临的科学和工程的新问题
    KDD Cup 2012(今年数据挖掘在中国)
    能力是在执行中实现的,要高节奏不要详细的设计
  • 原文地址:https://www.cnblogs.com/Zendic/p/1780888.html
Copyright © 2011-2022 走看看