效果图:
<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title>重写alert弹窗</title> </head> <body> <script> // window.alert = alert; // function alert(data) { // var parent_div = document.createElement("div"), // title_p = document.createElement("p"), // name_p = document.createElement("p"), // time_p = document.createElement("p"), // title_text = document.createTextNode(data ? "执行状态:"+data : ""), // name_text = document.createTextNode(data ? "操作人:"+data : ""), // time_text = document.createTextNode(data ? "操作时间:"+data : ""), // btn_div = document.createElement("div"), // btnText = document.createTextNode("确定"); // // 控制样式 // css(parent_div, { // "position" : "fixed", // "left" : "70%", // "right" : "0", // "top" : "20%", // "width" : "15%", // "margin" : "0 auto", // "background-color" : "#ffffff", // "font-size" : "20px", // "text-align" : "center", // "border":"1px solid darkcyan" // }); // css(btn_div, { // "background" : "#00b8ff", // }) // // 内部结构套入 // title_p.appendChild(title_text); // name_p.appendChild(name_text); // time_p.appendChild(time_text); // btn_div.appendChild(btnText); // parent_div.appendChild(title_p); // parent_div.appendChild(name_p); // parent_div.appendChild(time_p); // parent_div.appendChild(btn_div); // // 整体显示到页面内 // document.getElementsByTagName("body")[0].appendChild(parent_div); // // 确定绑定点击事件删除标签 // btn_div.onclick = function() { // parent_div.parentNode.removeChild(parent_div); // } // //自动清除 // setTimeout(function(){ // parent_div.parentNode.removeChild(parent_div); // },2000); // } // function css(targetObj, cssObj) { // var str = targetObj.getAttribute("style") ? targetObj.getAttribute("style") : ""; // for(var i in cssObj) { // str += i + ":" + cssObj[i] + ";"; // } // targetObj.style.cssText = str; // } // alert(123); ////右弹窗/// function right_alert(data) { var parent_div = document.createElement("div"), title_p = document.createElement("p"), name_p = document.createElement("p"), time_p = document.createElement("p"), // title_text = document.createTextNode(data ? "执行状态:" + data.LifeLinkChildName : ""), // name_text = document.createTextNode(data ? "操作人:" + data.AuditUserName : ""), // time_text = document.createTextNode(data ? "操作时间:" + data.AuditDate.substring(0,19).replace("T"," "): ""), title_text = document.createTextNode(data ? "执行状态:" + data : ""), name_text = document.createTextNode(data ? "操作人:" + data : ""), time_text = document.createTextNode(data ? "操作时间:" + data : ""), btn_div = document.createElement("div"), btnText = document.createTextNode("确定"); // 控制样式 css(parent_div, { "padding-top": "21px", "position": "fixed", "left": "70%", "right": "0", "top": "25%", "width": "19%", "margin": "0 auto", "background-color": "#ffffff", "font-size": "20px", "text-align": "center", "border": "10px outset #a3b1b1" }); css(btn_div, { "background": "#00b8ff", }) // 内部结构套入 title_p.appendChild(title_text); name_p.appendChild(name_text); time_p.appendChild(time_text); btn_div.appendChild(btnText); parent_div.appendChild(title_p); parent_div.appendChild(name_p); parent_div.appendChild(time_p); parent_div.appendChild(btn_div); // 整体显示到页面内 document.getElementsByTagName("body")[0].appendChild(parent_div); // 确定绑定点击事件删除标签 btn_div.onclick = function () { parent_div.parentNode.removeChild(parent_div); } //自动清除 setTimeout(function () { parent_div.parentNode.removeChild(parent_div); }, 2000); }; function css(targetObj, cssObj) { var str = targetObj.getAttribute("style") ? targetObj.getAttribute("style") : ""; for (var i in cssObj) { str += i + ":" + cssObj[i] + ";"; } targetObj.style.cssText = str; } right_alert(123) </script> </body> </html>