JavaScriptを使用してプロンプトボックスをポップアップ表示する方法

Web 開発では、ポップアップ プロンプト ボックスは非常に一般的なものであり、特にユーザー操作のプロンプト、確認、警告などでは、ポップアップ ボックスの形式で操作する必要があり、同時に, 特定のフィードバックをユーザーに与えることができます. JavaScript にはプロンプト ボックスをポップアップする機能があります. 以下では、JavaScript を使用してプロンプト ボックスをポップアップする方法を紹介します。

JavaScript には、警告ボックス (alert)、確認ボックス (confirm)、およびプロンプト ボックス (prompt) という 3 つの異なるタイプのポップアップ ウィンドウが用意されています。これら 3 種類のポップアップ ウィンドウは非常にシンプルで使いやすく、多くのパラメーターは必要ありません。

1. 警告ボックス (アラート)

警告ボックスは最も単純なポップアップ ウィンドウであり、通常はユーザーに特定の警告情報を表示するために使用されます。必要なパラメータは表示する情報のみです。

構文:

alert(message);

このうち、messageは表示する文字列情報です。

例:

alert("欢迎使用JavaScript弹窗");

警告ボックスが表示された後、ユーザーが「OK」ボタンをクリックするまで画面は強制的に一時停止されます。アラート ボックスは、カスタム ボタン テキストとカスタム スタイルをサポートしていません。

2. 確認ボックス (confirm)

確認ボックスは通常、ユーザーに操作を実行するかどうかを尋ねるために使用されます。 2 つのパラメータが必要です。最初のパラメータは表示されるプロンプト情報で、2 番目のパラメータはユーザーのクリック イベントを処理するコールバック関数です。

構文:

confirm(message, callback);

このうち、message は表示する文字列情報、callback はユーザーが [OK] または [キャンセル] をクリックしたときに呼び出されるコールバック関数です。ユーザーが「OK」をクリックすると、コールバック関数の戻り値は true になり、それ以外の場合は false が返されます。

例:

confirm("确定要删除这条记录吗？", function(result){
    if(result){
        //用户点击了确定按钮
        //执行删除操作
    }else{
        //用户点击了取消按钮
        //不执行删除操作
    }
});

確認ボックスは、カスタム ボタン テキストとカスタム スタイルをサポートしています。

3. プロンプト ボックス (プロンプト)

プロンプト ボックスは、ユーザーが情報を入力できるようにするために使用されます。これには 2 つのパラメータが必要です。最初のパラメータは表示されるプロンプト情報で、2 番目のパラメータはユーザー入力ボックス (オプション) のデフォルト値です。

構文:

prompt(message, defaultValue);

例:

var name = prompt("请输入您的姓名：", "张三");
if(name){
    alert("您好，" + name);
}else{
    alert("您取消了输入！");
}

プロンプト ボックスは、入力ボックスのデフォルト値のカスタマイズ、ボタン テキストのカスタマイズ、スタイルのカスタマイズをサポートしています。

概要:

上記の 3 つのポップアップ ウィンドウは、JavaScript でよく使用されるポップアップ ウィンドウのメソッドであり、必要に応じて、対応するポップアップ ウィンドウの種類を選択できます。実際の開発では、ポップアップ ウィンドウがユーザーの操作を妨げることに注意する必要があり、ポップアップ ウィンドウの頻度が高すぎると、ユーザー エクスペリエンスに影響を与えるため、ポップアップ ウィンドウの使用頻度を調整する必要があります。適切に管理されています。

以上がJavaScriptを使用してプロンプトボックスをポップアップ表示する方法の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。