JavaScriptにはどのようなダイアログボックスがありますか? jsの3種類のダイアログボックス

この記事では、JavaScript で使用できるダイアログ ボックスについて説明します。 js の 3 種類のダイアログ ボックスでは、js を使用してダイアログ ボックスをポップアップする方法と 3 種類のダイアログ ボックスの機能を説明します。困っている友人は参考にしていただければ幸いです。

JavaScript は、alert()、confirm()、prompt() の 3 つの関数に対応する 3 つの重要なタイプのダイアログ ボックスをサポートしています。これらのダイアログ ボックスは、警告を発したり、入力を確認したり、ユーザーから入力を取得したりするために使用できます。以下では、各ダイアログ ボックスを 1 つずつ説明します。

[アラート] ダイアログ ボックス:alert()

alert() は、主にユーザーに警告メッセージを発行するために使用されます。たとえば、入力フィールドにテキストが必要であるにもかかわらず、ユーザーが入力を行わなかった場合、アラート ボックスを使用して、検証の一環として警告メッセージを発行できます。

ただし、アラート ボックスは、よりわかりやすいメッセージに引き続き使用できます。アラート ボックスには、選択して続行するための「OK」ボタンのみが表示されます。

#例:

html コード:

<p>点击下面查看消息：</p>

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

js コード:

function message() {
	alert("这是一个警告信息！");

	document.write("<p style=&#39;text-align: center;&#39;>这是一个警告信息！<p>");
}

実行結果:

確認ダイアログ ボックス:confirm()

confirm() は主に、オプションに対するユーザーの同意を得るために使用されます。 [OK]、[キャンセル] の 2 つのボタンがあるダイアログ ボックスが表示されます。

ユーザーが「OK」ボタンをクリックすると、ウィンドウメソッド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=&#39;text-align: center;&#39;>用户希望继续！</p>");
		return true;
	} else {
		document.write("<p style=&#39;text-align: center;&#39;>用户不希望继续！</p>");
		return false;
	}
}

実行結果:

プロンプト ダイアログ ボックス:prompt()

prompt():プロンプト ダイアログ ボックスは、テキスト ボックスをポップアップしてユーザー入力を取得する場合に非常に便利です。したがって、ユーザーと対話できるようになります。ユーザーはフィールドに入力して「OK」をクリックする必要があります。

prompt() メソッドは、ユーザーが入力した後に、ユーザーが入力した文字列を返します。これには 2 つのパラメータがあります:

1、プロンプト情報の表示

2、入力ボックスの表示、およびデフォルトの文字列。

prompt() メソッドは、ユーザーが入力した後に、ユーザーが入力した文字列を返します。

このダイアログ ボックスには、[OK] と [キャンセル] の 2 つのボタンがあります。ユーザーが「OK」ボタンをクリックすると、ウィンドウの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=&#39;text-align: center;&#39;>用戶沒有輸入，值為：“" + retVal + "”</p>");
	else
		document.write("<p style=&#39;text-align: center;&#39;>欢迎“" + retVal + "”进入</p>");

}

ランニング効果 :

要約: 以上がこの記事の全内容です。皆様の学習に少しでもお役に立てれば幸いです。

以上がJavaScriptにはどのようなダイアログボックスがありますか? jsの3種類のダイアログボックスの詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。