JavaScriptのプロンプトを閉じる

WBOY
リリース: 2023-05-09 09:07:37
オリジナル
2028 人が閲覧しました

JavaScript オフ プロンプト

フロントエンド開発者として、私たちは JavaScript を使用して、Web サイトに動的な効果やインタラクティブな機能を追加する必要があることがよくあります。その中でも、ポップアップ ボックスまたはプロンプト ボックスは一般的な機能であり、ユーザーに特定の操作の実行を思い出させたり、何らかの情報を表示したりするために使用されます。この場合、JavaScript のアラートまたは確認関数を使用してプロンプト ボックスをポップアップ表示する必要があります。

アラートと確認の主な機能は、メッセージ、またはメッセージと確認またはキャンセルのボタンをポップアップ表示することです。これらの機能を閉じるには、ユーザーが手動で確認ボタンまたはキャンセルボタンをクリックする必要があります。ただし、ユーザー エクスペリエンスをより適切に制御するために、ポップアップ ボックスを自動的に閉じたい場合があります。この記事では、JavaScript を使用してツールヒントを閉じる方法について説明します。

アラート プロンプト ボックスを閉じる

アラート プロンプト ボックスを閉じるには、setTimeout 関数を使用する必要があります。 setTimeout 関数は、指定された時間の経過後に関数を実行するために使用されます。この関数を使用すると、一定時間が経過した後にアラート プロンプト ボックスを閉じることができます。

次のコードは、5 秒後にアラート プロンプト ボックスを閉じる方法を示しています。

alert("这是一条提示信息!");

setTimeout(function(){
    window.close();
}, 5000);
ログイン後にコピー

上記のコードでは、setTimeout 関数を使用して、5 秒後に匿名関数を実行します。この関数では window.close() メソッドを呼び出して、現在のウィンドウを閉じます。セキュリティ上の理由により、JavaScript はブラウザ ウィンドウを直接閉じることはできませんが、JavaScript によって開かれたウィンドウまたはタブを閉じることはできることに注意してください。

確認プロンプト ボックスを閉じる

アラート プロンプト ボックスとは異なり、確認プロンプト ボックスでは、ユーザーが手動で確認またはキャンセル ボタンをクリックして閉じる必要があります。ただし、ユーザーが操作を実行した後、確認プロンプト ボックスを自動的に閉じたい場合もあります。

次のコードは、ユーザーが「確認」または「キャンセル」を選択した後に確認プロンプト ボックスを自動的に閉じる方法を示しています。

var confirmed = confirm("你确认要执行这个操作吗?");

if (confirmed === true) {
    setTimeout(function(){
        window.close();
    }, 5000);
} else {
    // 用户取消操作,不需要关闭提示框
}
ログイン後にコピー

上記のコードでは、まず確認関数を使用してプロンプト ボックスをポップアップ表示し、ユーザーが「確認」または「キャンセル」を選択するのを待ちます。ユーザーが「確認」を選択すると、プロンプト ボックスは 5 秒後に自動的に閉じます。ユーザーが「キャンセル」を選択した場合、プロンプト ボックスを閉じる必要はありません。

概要

JavaScript プロンプト ボックス (警告と確認) は、Web アプリケーションの一般的な機能であり、ユーザーに特定の操作の実行や情報の表示を思い出させるために使用できます。これらのプロンプト ボックスはデフォルトでは手動で閉じる必要がありますが、ユーザー エクスペリエンスをより適切に制御するために、JavaScript を使用してプロンプト ボックスを自動的に閉じることができる場合があります。アラートまたは確認プロンプト ボックスを閉じるときに、setTimeout 関数を使用して操作の実行を遅らせ、自動的に閉じることができます。

以上がJavaScriptのプロンプトを閉じるの詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。

ソース:php.cn
このウェブサイトの声明
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。
人気のチュートリアル
詳細>
最新のダウンロード
詳細>
ウェブエフェクト
公式サイト
サイト素材
フロントエンドテンプレート