码迷,mamicode.com
首页 > 其他好文 > 详细

系统弹出框

时间:2015-01-28 17:26:08      阅读:121      评论:0      收藏:0      [点我收藏+]

标签:

  1         /**
  2          * 系统弹出框
  3          */
  4         sAlert: function(tit,str,conf){
  5             if(document.getElementById("bgDiv")!=null){
  6                 return;
  7             }  
  8             var sWidth = document.body.offsetWidth;
  9             var sHeight = document.body.scrollHeight;
 10             var bgObj = document.createElement("div");
 11             bgObj.setAttribute(‘id‘, ‘bgDiv‘);
 12             bgObj.setAttribute(‘class‘, ‘msgCover‘);
 13             bgObj.style.width = sWidth + "px";
 14             bgObj.style.height = sHeight + "px";
 15             document.body.appendChild(bgObj);
 16             
 17             var msgObj = document.createElement("div");
 18             msgObj.setAttribute("id", "msgDiv");
 19             msgObj.setAttribute("class", "msgbox");
 20             
 21             var title = document.createElement("h4");
 22             title.setAttribute("id", "msgTitle");
 23             title.innerHTML = tit;
 24             document.body.appendChild(msgObj);
 25             document.getElementById("msgDiv").appendChild(title);
 26             
 27             var txt = document.createElement("p");
 28             txt.innerHTML = str;
 29             document.getElementById("msgDiv").appendChild(txt);
 30             
 31             var msgFooter = document.createElement("div");
 32             msgFooter.setAttribute("id", "msg_footer");
 33             document.getElementById("msgDiv").appendChild(msgFooter);
 34             
 35             var confirm = document.createElement("button");
 36             confirm.setAttribute("id", "confirm");
 37             confirm.setAttribute("class", "msg_btn_y");
 38             confirm.innerHTML = "确定";
 39             confirm.onclick = function() {
 40                 SA.method(conf);
 41                 document.body.removeChild(bgObj); 
 42                 document.getElementById("msgDiv").removeChild(title); 
 43                 document.body.removeChild(msgObj);
 44             };
 45             document.getElementById("msg_footer").appendChild(confirm);
 46             
 47             var cencel = document.createElement("button");
 48             cencel.setAttribute("id", "cencel");
 49             cencel.setAttribute("class", "msg_btn_n");
 50             cencel.innerHTML = "取消";
 51             cencel.onclick = function() {
 52                 document.body.removeChild(bgObj); 
 53                 document.getElementById("msgDiv").removeChild(title); 
 54                 document.body.removeChild(msgObj);
 55             };
 56             document.getElementById("msg_footer").appendChild(cencel);
 57         },
 58         
 59         dAlert: function(tit,str,conf){
 60             if(document.getElementById("bgDiv")!=null){
 61                 return;
 62             }
 63 
 64             var sWidth = document.body.offsetWidth;
 65             var sHeight = document.body.scrollHeight;
 66             
 67             var bgObj = document.createElement("div");
 68             bgObj.setAttribute(‘id‘, ‘bgDiv‘);
 69             bgObj.setAttribute(‘class‘, ‘msgCover‘);
 70             bgObj.style.width = sWidth + "px";
 71             bgObj.style.height = sHeight + "px";
 72             document.body.appendChild(bgObj);
 73             
 74             var msgObj = document.createElement("div");
 75             msgObj.setAttribute("id", "msgDiv");
 76             msgObj.setAttribute("class", "msgbox");
 77             
 78             var title = document.createElement("h4");
 79             title.setAttribute("id", "msgTitle");
 80             title.innerHTML = tit;
 81             document.body.appendChild(msgObj);
 82             document.getElementById("msgDiv").appendChild(title);
 83             
 84             var txt = document.createElement("p");
 85             txt.innerHTML = str;
 86             document.getElementById("msgDiv").appendChild(txt);
 87             
 88             var msgFooter = document.createElement("div");
 89             msgFooter.setAttribute("id", "msg_footer");
 90             document.getElementById("msgDiv").appendChild(msgFooter);
 91             
 92             var confirm = document.createElement("button");
 93             confirm.setAttribute("id", "confirm");
 94             confirm.setAttribute("class", "msg_btn_y");
 95             confirm.innerHTML = "确定";
 96             confirm.onclick = function() {
 97                 
 98                 SA.method(conf);
 99                 document.body.removeChild(bgObj); 
100                 document.getElementById("msgDiv").removeChild(title); 
101                 document.body.removeChild(msgObj);
102             };
103             document.getElementById("msg_footer").appendChild(confirm);
104             
105         },
106         method: function(methodName){
107             this.func = function() {};
108             try {
109                 this.func = eval(methodName);
110             } catch(e) {}
111         },
<style type="text/css">
    .msgCover {
    background: none repeat scroll 0 0 #777;
    opacity: 0.65;
    position: absolute;
    top: 0;
    left: 0;
    z-index: 10000;
}
.msgbox {
    background: none repeat scroll 0 0 white;
    border: 1px solid #7f94b5;
    font: 12px/25px Verdana, Geneva, Arial, Helvetica, sans-serif;
    left: 5%;
    position: fixed;
    top: 30%;
    width: 90%;
    z-index: 10001;
    text-align: left;
}
.msgbox #msg_footer .msg_btn_y {
    background: none repeat scroll 0 0 #7f94b5;
    border: 1px solid #7f94b5;
    color: white;
    cursor: pointer;
    font: 1.2em Verdana, Geneva, Arial, Helvetica, sans-serif;
    margin: 5px 7px;
    padding: 6px;
    width: 45%;
}
.msgbox #msg_footer .msg_btn_n {
    border: 1px solid #7f94b5;
    color: #7f94b5;
    cursor: pointer;
    font: 1.2em Verdana, Geneva, Arial, Helvetica, sans-serif;
    margin: 5px 7px;
    padding: 6px;
    width: 45%;
}
</style>

调用:SA.dAlert("系统提示",“内容”);



 

系统弹出框

标签:

原文地址:http://www.cnblogs.com/yunmengxiaohe/p/4256315.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!