js重寫alert事件(避免alert彈框標(biāo)題出現(xiàn)網(wǎng)址)
更新時(shí)間:2020年12月04日 16:37:11 作者:13460286086
這篇文章主要給大家介紹了關(guān)于js重寫alert事件的相關(guān)資料,這樣可以避免alert彈框標(biāo)題出現(xiàn)網(wǎng)址的情況,文中通過示例代碼介紹的非常詳細(xì),對大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價(jià)值,需要的朋友們下面隨著小編來一起學(xué)習(xí)學(xué)習(xí)吧
js代碼:
window.alert = function(msg, callback) { var div = document.createElement("div"); div.innerHTML = "<style type=\"text/css\">" + ".nbaMask { position: fixed; z-index: 1000; top: 0; right: 0; left: 0; bottom: 0; background: rgba(0, 0, 0, 0.5); } " + ".nbaMaskTransparent { position: fixed; z-index: 1000; top: 0; right: 0; left: 0; bottom: 0; } " + ".nbaDialog { position: fixed; z-index: 5000; width: 80%; max-width: 300px; top: 50%; left: 50%; -webkit-transform: translate(-50%, -50%); transform: translate(-50%, -50%); background-color: #fff; text-align: center; border-radius: 8px; overflow: hidden; opacity: 1; color: white; }" + ".nbaDialog .nbaDialogHd { padding: .2rem .27rem .08rem .27rem; } " + ".nbaDialog .nbaDialogHd .nbaDialogTitle { font-size: 17px; font-weight: 400; } " + ".nbaDialog .nbaDialogBd { padding: 0 .27rem; font-size: 15px; line-height: 1.3; word-wrap: break-word; word-break: break-all; color: #000000; } " + ".nbaDialog .nbaDialogFt { position: relative; line-height: 48px; font-size: 17px; display: -webkit-box; display: -webkit-flex; display: flex; } " + ".nbaDialog .nbaDialogFt:after { content: \" \"; position: absolute; left: 0; top: 0; right: 0; height: 1px; border-top: 1px solid #e6e6e6; color: #e6e6e6; -webkit-transform-origin: 0 0; transform-origin: 0 0; -webkit-transform: scaleY(0.5); transform: scaleY(0.5); } " + ".nbaDialog .nbaDialogBtn { display: block; -webkit-box-flex: 1; -webkit-flex: 1; flex: 1; color: #09BB07; text-decoration: none; -webkit-tap-highlight-color: transparent; position: relative; margin-bottom: 0; } " + ".nbaDialog .nbaDialogBtn:after { content: \" \"; position: absolute; left: 0; top: 0; width: 1px; bottom: 0; border-left: 1px solid #e6e6e6; color: #e6e6e6; -webkit-transform-origin: 0 0; transform-origin: 0 0; -webkit-transform: scaleX(0.5); transform: scaleX(0.5); } " + ".nbaDialog a { text-decoration: none; -webkit-tap-highlight-color: transparent; }" + "</style>" + "<div id=\"dialogs2\" style=\"display: none\">" + "<div class=\"nbaMask\"></div>" + "<div class=\"nbaDialog\">" + " <div class=\"nbaDialogHd\">" + " <strong class=\"nbaDialogTitle\"></strong>" + " </div>" + " <div class=\"nbaDialogBd\" id=\"dialog_msg2\">彈窗內(nèi)容,告知當(dāng)前狀態(tài)、信息和解決方法,描述文字盡量控制在三行內(nèi)</div>" + " <div class=\"nbaDialogHd\">" + " <strong class=\"nbaDialogTitle\"></strong>" + " </div>" + " <div class=\"nbaDialogFt\">" + " <a href=\"javascript:;\" class=\"nbaDialogBtn nbaDialogBtnPrimary\" id=\"dialog_ok2\">確定</a>" + " </div></div></div>"; document.body.appendChild(div); var dialogs2 = document.getElementById("dialogs2"); dialogs2.style.display = 'block'; var dialog_msg2 = document.getElementById("dialog_msg2"); dialog_msg2.innerHTML = msg; // var dialog_cancel = document.getElementById("dialog_cancel"); // dialog_cancel.onclick = function() { // dialogs2.style.display = 'none'; // }; var dialog_ok2 = document.getElementById("dialog_ok2"); dialog_ok2.onclick = function() { dialogs2.style.display = 'none'; callback(); }; };
html引用:
<!DOCTYPE html> <html> <head> <title>alert.html</title> <meta charset="UTF-8"> <meta name="keywords" content="keyword1,keyword2,keyword3"> <meta name="description" content="this is my page"> <meta name="content-type" content="text/html; charset=UTF-8"> <!--<link rel="stylesheet" type="text/css" href="./styles.css" rel="external nofollow" >--> </head> <body> This is my HTML page. <br> <script type="text/javascript" src="alert.js"></script> <script type="text/javascript"> alert("哈哈哈?。?!看,沒有標(biāo)題~_~"); </script> </body> </html>
總結(jié)
到此這篇關(guān)于js重寫alert事件(避免alert彈框標(biāo)題出現(xiàn)網(wǎng)址)的文章就介紹到這了,更多相關(guān)js重寫alert事件內(nèi)容請搜索腳本之家以前的文章或繼續(xù)瀏覽下面的相關(guān)文章希望大家以后多多支持腳本之家!
相關(guān)文章
JavaScript設(shè)計(jì)模式---單例模式詳解【四種基本形式】
這篇文章主要介紹了JavaScript設(shè)計(jì)模式---單例模式,結(jié)合實(shí)例形式詳細(xì)分析了JavaScript設(shè)模式中單例模式的四種基本形式定義與使用方法,需要的朋友可以參考下2020-05-05JS效率個(gè)人經(jīng)驗(yàn)談(8-15更新),加入range技巧
JS效率個(gè)人經(jīng)驗(yàn)談(8-15更新),加入range技巧...2007-01-01javascript函數(shù)特點(diǎn)實(shí)例分析
這篇文章主要介紹了javascript函數(shù)特點(diǎn),實(shí)例分析了javascript函數(shù)傳遞參數(shù)及調(diào)用方法,需要的朋友可以參考下2015-05-05webpack常用構(gòu)建優(yōu)化策略小結(jié)
這篇文章主要介紹了webpack常用構(gòu)建優(yōu)化策略小結(jié),文中通過示例代碼介紹的非常詳細(xì),對大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價(jià)值,需要的朋友們下面隨著小編來一起學(xué)習(xí)學(xué)習(xí)吧2019-11-11詳解ES6 擴(kuò)展運(yùn)算符的使用與注意事項(xiàng)
擴(kuò)展運(yùn)算符 (spread syntax) 是 ES6 提供的一種非常便捷的新語法,給我們操作數(shù)組和對象帶來了非常大的便利,我在很多文章中也提到了這個(gè)語法。但是其實(shí)擴(kuò)展運(yùn)算符的用法還是比較多比較雜的,我用一篇文章來做一下總結(jié),梳理一下擴(kuò)展運(yùn)算的語法和使用細(xì)節(jié)。2020-11-11