20190222/简单的修改alert框

<script>
    window.alert = function(txt)
{
var shield = document.createElement("DIV");
shield.id = "shield";
shield.style.position = "absolute";
shield.style.left = "0px";
shield.style.top = "0px";
shield.style.width = "100%";
shield.style.height = window.innerHeight+"px";
shield.style.background = "#333";
shield.style.textAlign = "center";
shield.style.zIndex = "10000";
shield.style.filter = "alpha(opacity=1)";
shield.style.opacity = "0.2";

var alertFram = document.createElement("DIV");
alertFram.id="alertFram";
alertFram.style.position = "absolute";
alertFram.style.left = "50%";
alertFram.style.top = "50%";
alertFram.style.marginLeft = "-225px";
alertFram.style.marginTop = "-95px";
alertFram.style.width = "450px";
alertFram.style.height = "160px";
alertFram.style.background = "white";
alertFram.style.lineHeight = "155px";
alertFram.style.zIndex = "10001";
strHtml = "<ul style=\"position: relative;margin: 0;width: 450px;height: 160px;box-shadow: 0 0 1px 1px #5555;list-style: none;border-radius: 5px;\">\n";
strHtml += " <li style=\" border-radius: 10px;padding-left: 15px;padding-top:15px;height: 40px;   line-height: 45px;font-size: 18px;line-height: 45px;font-size: 18px;font-weight: 700;font-weight: 700;\"></li>\n";
strHtml += " <li style=\" border-radius: 10px;padding-left: 15px;height: 40px;  margin-left: 50px;line-height: 45px;\">"+str+"</li>\n";
strHtml += " <li style=\" border-radius: 10px;padding-left: 15px;height: 40px;\"><button style=\" cursor: pointer;margin-right: 5%;width: 70px;height: 40px;background-color: red;color: white;border: 0;border-radius: 10px; position: relative;top: -50px;left:35%\" onclick=\"doOk()\">确定</button></li>\n";
strHtml += "</ul>\n";
alertFram.innerHTML = strHtml;
document.body.appendChild(alertFram);
document.body.appendChild(shield);
var c = 0;
this.doAlpha = function(){
if (c++ > 20){clearInterval(ad);return 0;}
shield.style.filter = "alpha(opacity="+c+");";
}
// var ad = setInterval("doAlpha()",5);
this.doOk = function(){
alertFram.style.display = "none";
shield.style.display = "none";
}
alertFram.focus();
document.body.onselectstart = function(){return false;};
}
</script>

这么简单的事情,本来打算用sweetalert,发现type="submit"的button出现alert会发现闪退的现象。(其他的alert美化插件也会闪退)

emmmm重写js会比较好。因为本来是修改,下次的话还是一开始就用layui和bootstrap比较好。

还有一个没有解决的问题,怎么根据返回的txt中的\n来进行分行展示。

var str=txt.value.split("\r\n");

不知道怎么传值啊啊啊,只能在控制台实现。

猜你喜欢

转载自blog.csdn.net/weixin_38308137/article/details/87890562