可以在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>