javascript有哪些對話框？

本篇文章給大家介紹了javascript有哪些對話框？javascript的三種對話框分別是什么？為了大家了解對話框的作用。給大家總結了以下內容，話不多說，一起往下看吧。

JavaScript支持三種重要類型的對話框，分別對應三個函數：alert()、confirm()、prompt()。這些對話框可用于發出警報，或者對任何輸入進行確認或從用戶那里獲得一種輸入。下面我們將逐一討論每個對話框。

警報對話框：alert()

alert()主要用于向用戶發出警告消息。例如，如果一個輸入字段需要輸入一些文本但用戶不提供任何輸入，那么作為驗證的一部分，您可以使用警告框來發出警告消息。

盡管如此，警報框仍可用于更友好的消息。警報框只提供一個“確定”按鈕來選擇并繼續。

例:

html代碼：

<p>點擊下面查看消息：</p>

<form>
	<input type="button" value="查看消息" onclick="message();" />
</form>

js代碼：

function message() {
	alert("這是一個警告信息！");

	document.write("<p style='text-align: center;'>這是一個警告信息！<p>");
}

運行結果：

確認對話框：confirm()

confirm()主要用于征得用戶對任何選項的同意。它顯示一個帶有兩個按鈕的對話框：確定、取消。

如果用戶單擊“確定”按鈕，則窗口方法confirm（）將返回true。如果用戶單擊“取消”按鈕，則confirm（）返回false。你可以使用如下確認對話框。

例（html代碼一樣）：

html代碼：

<p>點擊下面查看結果：</p>

<form>
	<input type="button" value="查看消息" onclick="getConfirmation();" />
</form>

js代碼：

function getConfirmation() {
	var retVal = confirm("你想繼續嗎？");
	if(retVal == true) {
		document.write("<p style='text-align: center;'>用戶希望繼續！</p>");
		return true;
	} else {
		document.write("<p style='text-align: center;'>用戶不希望繼續！</p>");
		return false;
	}
}

運行結果：

提示對話框：prompt()

prompt()：當你想要彈出文本框以獲取用戶輸入時，提示對話框非常有用。因此，它使你能夠與用戶進行交互。用戶需要填寫該字段，然后單擊“確定”。

prompt()方法在用戶輸入后，返回用戶輸入的字符串。它有兩個參數，分別：

1、顯示提示信息

2、顯示輸入框和默認字符串。

prompt（）方法在用戶輸入后，返回用戶輸入的字符串。

此對話框有兩個按鈕：確定和取消。如果用戶單擊“確定”按鈕，則窗口prompt()方法將從文本框中返回輸入的值。如果用戶單擊“取消”按鈕，則窗口prompt()方法將返回null。

例：

以下示例顯示如何使用提示對話框

html代碼：

<p>點擊下面查看結果：</p>

<form>
	<input type="button" value="查看消息" onclick="getValue();" />
</form>

js代碼：

function getValue() {
	var retVal = prompt("輸入你的名字：", "你的名字在這里");

	if(retVal == null)
		document.write("<p style='text-align: center;'>用戶沒有輸入，值為：“" + retVal + "”</p>");
	else
		document.write("<p style='text-align: center;'>歡迎“" + retVal + "”進入</p>");

}

運行效果：

看完上述內容，你們對javascript對話框大概了解了嗎？如果想了解更多相關文章內容，歡迎關注億速云行業資訊頻道，感謝各位的閱讀！