javascript中的三種消息框 alert 警告框 confirm 確認框 prompt 提示框

可以在javascript中創建三種消息框:警告框、確認框、提示框。


警告框

警告框通常用於確保用戶可以得到某些消息。

當警告框出現後,用戶需要點擊確定按鈕才能繼續進行操作。

語法:

alert(‘文本’);


確認框

確認框可以使用戶驗證或者接受某些信息。

當確認框出現後,用戶需要點擊確定或者取消按鈕才能繼續進行操作。

如果用戶點擊確認,那麼返回true ,如果用戶點擊取消,那麼返回false 。

語法:

confirm(‘文本’);

提示框

提示框經常用於提示用戶進入頁面前輸入某個值。

當提示框出現後,用戶需要輸入某個值,點擊確定或者取消按鈕才能繼續操作。

如果用戶點擊確定按鈕,返回值爲用戶輸入的值,如果用戶點擊取消按鈕,返回值爲null 。

語法:

prompt(‘文本’,’輸入框中默認值’);

某些瀏覽器,如Chrome,IE   javascript消息框右上角都帶有關閉按鈕

警告框中 點擊關閉按鈕 作用等同於點擊確定按鈕

確認框中 點擊關閉按鈕 作用等同於點擊取消按鈕

提示框中 點擊關閉按鈕 作用等同於點擊取消按鈕


<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
    <title>javascript消息框</title>
</head>
<body>
    <input id="alertBtn" type="button" value="警告框" />
    <input id="alertBtn2" type="button" value="帶有轉折行的警告框" />
    <input id="confirmBtn" type="button" value="show a confirm box" />
    <input id="promptBtn" type="button" value="提示框" />
</body>
</html>

<script type="text/javascript">

    var alertBtn = document.getElementById('alertBtn');
    alertBtn.onclick = function () {
        alert('我是警告框');
    };

    var alertBtn2 = document.getElementById('alertBtn2');
    alertBtn2.onclick = function () {
        alert('再次向您問好,我是很長很長的警告框,再次向您問好,我是很長很長的警告框,再次向您問好,我是很長很長的警告框,再次向您問好,我是很長很長的警告框');
        alert('再次向您問好,\n我是主動換行的警告框');
    };

    var confirmBtn = document.getElementById('confirmBtn');
    confirmBtn.onclick = function () {
        if (confirm('press a button')) {
            alert('You pressed OK !');
        } else {
            alert('You pressed Cancel !');
        }
    };

    var promptBtn = document.getElementById('promptBtn');
    promptBtn.onclick = function () {
        var name = prompt('請輸入您的名字', 'Bill Gates');
        if (name != null && name != '') {
            alert('您好,'+name+',今天過的怎麼樣?');
        }
    };
</script>




發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章