ホームページ >ウェブフロントエンド >jsチュートリアル >jQueryを使ってポップアップウィンドウを作成する方法

jQueryを使ってポップアップウィンドウを作成する方法

coldplay.xixi
coldplay.xixiオリジナル
2020-12-11 09:27:4912611ブラウズ

jQuery を使用してポップアップ ウィンドウを作成する方法: 最初にボタン ラベルの ID を mybutton に設定し、次にその ID を通じてボタン オブジェクトを取得し、それにクリック イベントをバインドします。最後に、ボタンがをクリックすると、[confirm() ] メソッドを使用してダイアログ ボックスが表示されます。

jQueryを使ってポップアップウィンドウを作成する方法

#このチュートリアルの動作環境: Windows7 システム、jquery3.2.1 バージョン、thinkpad t480 コンピューター。

推奨:

jquery ビデオ チュートリアル

jQuery を使用してポップアップ ウィンドウを作成する方法:

1. 作成test.html という名前の新しい HTML ファイルは、jquery を使用してダイアログ ボックスをポップアップする方法を説明するために使用されます。

jQueryを使ってポップアップウィンドウを作成する方法

2. test.html ファイルで、button タグを使用して、クリックするとダイアログ ボックスをポップアップするボタンを作成します。

jQueryを使ってポップアップウィンドウを作成する方法

3. test.html ファイルで、ボタン ラベルの ID を

mybutton に設定します。ボタン オブジェクトは、以下のこの ID を通じて取得されます。 。

jQueryを使ってポップアップウィンドウを作成する方法

4. js タグ内で、

ready() メソッドを使用して function メソッドを実行し、ページの作成時にクリック イベントをボタンにバインドします。ロードされています。

jQueryを使ってポップアップウィンドウを作成する方法

5. function メソッドで、ID を介してボタン オブジェクトを取得し、それにクリック イベントをバインドし、ボタンがクリックされたときに、

confirm( )メソッドによりダイアログ ボックスが表示され、ユーザーが「OK」をクリックすると、write() メソッドを使用してプロンプトが出力されます。

jQueryを使ってポップアップウィンドウを作成する方法

#6. ブラウザで test.html ファイルを開き、ボタンをクリックして結果を表示します。

jQueryを使ってポップアップウィンドウを作成する方法

関連する学習に関する推奨事項:

JavaScript 学習チュートリアル

以上がjQueryを使ってポップアップウィンドウを作成する方法の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。

声明:
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。