Heim > Artikel > Web-Frontend > Einführung in die Änderung des Warnungsstils in JavaScript
In unserem vorherigen Artikel haben wir Ihnen eine detaillierte Erklärung der Verwendung von Alert() in JavaScript vorgestellt. Wir alle wissen, dass Alert() in JavaScript ein Meldungsdialogfeld und das Warnmeldungsdialogfeld öffnet Wird normalerweise für einige Benutzeraufforderungsinformationen verwendet. Sein Stil war schon immer der Standard. Kann ich seinen Stil ändern? Heute werde ich Ihnen beibringen, wie Sie den Benachrichtigungsstil in JavaScript ändern!
Einführung in die Methode zum Ändern des Benachrichtigungsstils mithilfe von JavaScript
<script language="javascript" type="text/javascript"> 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 = document.body.scrollHeight+"px"; shield.style.background = "#333"; shield.style.textAlign = "center"; shield.style.zIndex = "10000"; shield.style.filter = "alpha(opacity=0)"; 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 = "-75px"; alertFram.style.width = "450px"; alertFram.style.height = "150px"; alertFram.style.background = "#ccc"; alertFram.style.textAlign = "center"; alertFram.style.lineHeight = "150px"; alertFram.style.zIndex = "10001"; strHtml = "<ul style="list-style:none;margin:0px;padding:0px;width:100%"> "; strHtml += " <li style="background:#DD828D;text-align:left;padding-left:20px;font-size:14px;font-weight:bold;height:25px;line-height:25px;border:1px solid #F9CADE;">[系统提示]</li> "; strHtml += " <li style="background:#fff;text-align:center;font-size:12px;height:120px;line-height:120px;border-left:1px solid #F9CADE;border-right:1px solid #F9CADE;">"+txt+"</li> "; strHtml += " <li style="background:#FDEEF4;text-align:center;font-weight:bold;height:25px;line-height:25px; border:1px solid #F9CADE;"> <input type="button" value="确 定" onclick="doOk()" /></li> "; strHtml += "</ul> "; 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>
Zusammenfassung:
Nachdem wir diesen Artikel studiert und verstanden haben, können wir sehen, dass der Stil von warning() in JavaScript geändert werden kann. Wenn Sie bei der Arbeit darauf stoßen, können Sie aus diesem Artikel lernen !Verwandte Empfehlungen:
Das obige ist der detaillierte Inhalt vonEinführung in die Änderung des Warnungsstils in JavaScript. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!