JavaScript入門チュートリアル(11) jsイベント処理_基礎知識

イベント処理の概要
イベント処理は、オブジェクトベースのプログラミングの非常に重要な部分です。イベント処理がなければ、プログラムは機能不全になり、柔軟性が失われます。イベント処理のプロセスは次のように表現できます: イベントの発生 - イベント ハンドラーの開始 - イベント ハンドラーの反応。その中で、イベント ハンドラーを開始するには、何かが起こった場合にどのハンドラーを開始するかをオブジェクトに最初に指示する必要があります。そうしないと、プロセスを続行できません。イベント ハンドラーには任意の JavaScript ステートメントを使用できますが、通常は特定のカスタム関数を使用して処理します。
イベントハンドラを指定するには、次の 3 つの方法があります。
方法 1 HTML タグ内で直接指定します。 この方法が最も一般的に使用されます。方法は次のとおりです:

コードをコピーします コードは次のとおりです:

例を見てみましょう:

コードをコピー コードは次のとおりです:

この タグの定義により、ドキュメントの読み取り時にダイアログ ボックスがポップアップ表示され、「 Web ページの閲覧「完了しました。ゆっくりお楽しみください」; ユーザーが文書を終了する (またはウィンドウを閉じるか、別のページに移動する) と、「さようなら」がポップアップ表示されます。
方法 2: 特定のオブジェクトの特定のイベント用の JavaScript を作成します。 この方法はめったに使用されませんが、状況によっては依然として役立ちます。メソッドは次のとおりです:

コードをコピーします コードは次のとおりです:

<スクリプト言語="JavaScript" for ="オブジェクト" イベント="イベント">
...
(イベント ハンドラー コード)
...

コードをコピー コードは次のとおりです:

方法 3 を JavaScript で説明します。 メソッド:
. = ;
このメソッドで注意すべき点は、「イベント ハンドラー」は実際にはコードであるということです。弦。イベント ハンドラーがカスタム関数の場合、パラメーターを使用する必要がない場合は、「()」を追加しないでください。
functionignoreError() {
return true;
}
window.onerror =ignoreError; // "()" は使用されません
この例では、ignoreError() 関数をウィンドウとして定義しますobject onerror イベントのハンドラー。その効果は、ウィンドウ オブジェクトの下のエラーを無視することです (アクセスを許可しない位置オブジェクトの参照によって発生する「許可なし」エラーは無視できません)。
イベントの詳細
onblur イベントは、ウィンドウがフォーカスを失ったときに発生します。適用対象: window オブジェクト
onchange イベントは、テキスト入力領域の内容が変更され、フォーカスがテキスト入力領域から移動した後に発生します。このイベントのキャプチャは、主に入力の有効性をリアルタイムで検出するため、またはドキュメントの内容を即座に変更するために使用されます。適用対象: Password オブジェクト、Select オブジェクト、Textarea オブジェクト
オブジェクトがクリックされると発生します。クリックとは、マウスをオブジェクト上に置き、マウス ボタンを押し、マウスを動かさずにマウス ボタンを放すという完全なプロセスを指します。通常のボタン オブジェクト (Button) には、通常、onclick イベント ハンドラーがあります。これは、この種のオブジェクトはユーザーから情報をまったく取得できず、onclick イベント ハンドラーがなければ役に立たないためです。 onclick イベント ハンドラーをボタンに追加すると、イベント ハンドラーでアクション、ターゲット、エンコーディング、メソッドなどのフォームの 1 つまたは複数の属性を変更し、次の submit() メソッドを呼び出すことで、「別の送信ボタン」をシミュレートできます。フォーム。 Link オブジェクトの onclick イベント ハンドラーで false を返すと、ブラウザーは接続を開けなくなります。つまり、次のような接続がある場合: http://www.a.com" onclick="return false">Go!ユーザーに関係なく、ユーザーがブラウザでの JavaScript の実行を禁止しない限り、どのようにクリックしても、www.a.com Web サイトにはアクセスできません。適用対象: Button オブジェクト、Image オブジェクト、Reset オブジェクト、エラーが発生したときに発生する
そのイベント ハンドラーは通常「エラー ハンドラー」と呼ばれ、エラーを処理するために使用されます。前述したように、すべてのエラーを無視するには、次を使用します:

コードをコピー コードは次のとおりです:

関数ignoreError() {
return true
}
window.onerror =ignoreError;

適用対象: window オブジェクト
onfocus イベントは、ウィンドウがフォーカスを取得したときに発生します。適用対象: window オブジェクト
onload イベントは、すべてのドキュメントがダウンロードされるときに発生します。すべてのダウンロードが完了しました。これは、HTML ファイルだけでなく、含まれるすべての画像、プラグイン、コントロール、アプレットなどもダウンロードされたことを意味します。このイベントはウィンドウイベントですが、HTMLでイベントハンドラを指定する場合はタグ内に記述します。適用対象: window object
onmousedown イベントは、ユーザーがオブジェクト上にマウスを置いてマウス ボタンを押すと発生します。 onmouseup イベントを参照してください。適用対象: Button オブジェクト、Link オブジェクト
マウスがオブジェクトから離れると、onmouseout イベントが発生します。 onmouseover イベントを参照してください。適用対象: リンク オブジェクト
onmouseover イベントは、マウスがオブジェクト範囲に入ると発生します。このイベントと onmouseout イベントを画像の事前読み取りと組み合わせることで、マウスが画像接続上を移動したときに画像が変化する効果を実現できます。接続をポイントすると、ステータス バーにアドレスが表示されないことがありますが、これらの情報はいつでも変更できるようです。これらは次のように作成されます:

適用対象: リンク オブジェクト
onmouseup イベントは、ユーザーがオブジェクト上にマウスを置いてマウス ボタンを押し、マウス ボタンを放したときに発生します。マウスが放されたオブジェクト上にマウスがないときにマウス ボタンが押された場合、このイベントは発生しません。適用対象: Button オブジェクト、Link オブジェクト
onreset イベントは、フォームの「リセット」ボタンがクリックされると (押して放すとき) に発生します。イベント ハンドラーで false を返すことで、フォームがリセットされるのを防ぐことができます。適用対象: Form object
onresize イベントは、ウィンドウのサイズが変更されるときに発生します。適用対象: window object
onsubmit イベントは、フォームの [送信] ボタンがクリックされた (押して放した) ときに発生します。このイベントを使用して、フォームの有効性を確認できます。イベント ハンドラーで false を返すことにより、フォームの送信を防ぐことができます。適用対象: Form object
onunload イベントは、ユーザーがドキュメントを終了する (またはウィンドウを閉じるか、別のページに移動する) ときに発生します。 onloadと同様にHTMLで書きたい場合はタグ内に記述します。一部の Web マスターは、この方法を使用して「アンケート フォーム」をポップアップし、訪問者に入力を「強制」し、訪問者にリンクをクリックするように仕向けます。この「onunload="open..."」メソッドは非常に悪い方法だと思います。ポップアップするウィンドウが多すぎてリソースが不足することもあります。訪問者に言いたいことがあるなら、ウェブページで言うべきですよね？適用対象: ウィンドウ オブジェクト