從javascript的瀏覽器警報改爲html的彈出框

我有點不在我的聯盟中。我有一個表單單獨驗證每個字段，並用特定消息執行標準警報。現在，我需要將標準警報更改爲警告消息中的隱藏div內的警報消息（客戶端）從javascript的瀏覽器警報改爲html的彈出框

不確定從何處開始以及任何指導將不勝感激。

if(el != null) { 
       switch(el.name) { 
        case "firstName":    
         //First Name Field Validation, Return false if field is empty 
         if(f.firstName.value == "") 
         { 
          alert(bnadd_msg_002); 
          if ((typeof TeaLeaf != "undefined") && (typeof TeaLeaf.Client != "undefined") && (typeof TeaLeaf.Client.tlAddEvent != "undefined")) { 
           var nVO = { ErrorMessage : bnadd_msg_002} 
           var subtype="CustomErrorMsg"; 
           TeaLeaf.Event.tlAddCustomEvent(subtype, nVO); 
            } 
          return false; 
         } 
         break;

來源

2011-06-17 Jason

您不能通過插入元素來替換瀏覽器提示框，因爲'alert'被阻止。一個醜陋的選擇是使用[showModalDialog]（https://developer.mozilla.org/en/DOM/window.showModalDialog），但這在性能方面甚至更糟糕。 – Lekensteyn

製作一個函數，它改變div的內容，然後絕對地將它放在屏幕的中間。在你使用警報的地方調用該函數。這個「警示框」也需要某種關閉按鈕。當你加載你的腳本時，你應該添加一個隱藏div的事件到關閉按鈕。 jQuery中/ JavaScript的

一些僞/真正的代碼：

function betterAlert(msg){ 
    var jAlert = $('#myAlertDiv'), jWindow = $(window); 
    var nHeight = jWindow.height(); 
    var nWidth = jWindow.width(); 
    var nAlertHeight = jAlert.height(); 
    var nAlertWidth = jAlert.width(); 
    jAlert.css({top:((nWidth-nAlertWidth)/2)+'px',left:((nHeight -nAlertHeight)/2)+'px'}); 
    jAlert.html(msg); 
    jAlert.show(); 
} 
function closeAlert(){ 
    $('#myAlertDiv').hide(); 
} 
$('body, a.close').click(closeAlert);

，當然風格div來使用CSS你的心內容。

如果您更喜歡使用庫，另一個選擇是使用jQueryUI對話框。我相信任何一個庫都有類似的功能。您只需創建一個帶有警報消息的div並調用$（'＃myAlertDiv'）。dialog（）。與往常一樣，庫的缺點是它們會比編寫代碼慢一點，因爲庫需要支持比您需要的功能更多的功能。

來源

2011-06-17 15:55:37 aepheus

沒有關閉按鈕。設計規格要求錯誤顯示消失焦點 – Jason

如何在沒有關閉按鈕的情況下完成此操作？ – Jason

查看以上評論 – Jason

您可以簡單地覆蓋默認的window.alert方法。

window.alert = function(text) { 
    createAWonderfulDialog(text); 
};

即使我通常不建議覆蓋/更改任何構建方法，這是一個例外。舊式瀏覽器仍然使用完全過時的模式對話框鎖定整個瀏覽器。

繼續吧，幹吧！

來源

2011-06-17 15:53:45 jAndy

從javascript的瀏覽器警報改爲html的彈出框

回答

相關問題