ホームページ > ウェブフロントエンド > jsチュートリアル > JavaScript イベントに関する重要な手順_JavaScript のヒント

JavaScript イベントに関する重要な手順_JavaScript のヒント

WBOY
リリース: 2016-05-16 18:43:30
オリジナル
881 人が閲覧しました

1. JavaScript 非同期コールバック

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

<スクリプト言語="javascript ">
//処理関数 window.onload にロードされたコールバック関数を登録します。
window.onload =loaded
//メソッド window.alert のアドレスを show 関数に渡します。 >var show = window .alert;
show("success")
}


2, イベントobject
以下 js の実装では、textarea のテキスト ボックスに Enter を入力するときに改行が発生しません。つまり、Enter キーを無効にします



コードをコピー コードは次のとおりです。 < textarea >< /textarea>



3、このキーワード
ブラウザは、このキーワードを関数 (このキーワードを含む関数) を参照する現在の要素とみなします



コードをコピーします

<スクリプト言語 = " javascript">gt;
var li = document.getElementsByTagName("li");
for (var i = 0; i {
li[ i]. onclick = handeClick;
}
function handeClick()
{
this.style.backgroundColor = "red";
}



4. イベントのバブリングをキャンセルする
通常、子要素のスタイルを変更するか、イベントをトリガーすると、バブリングの原則に従って、その親要素がこのようなことが起こらないようにするには、イベントのバブリングをキャンセルする必要があります。
次の例は、マウスがホバーしている現在の要素に赤い境界線を追加することを示しています。イベントのバブリングを防止しないと、要素の上にマウスを移動するたびに、その要素とその親要素に赤い境界線が表示されますが、これは望ましくないことです。




コードをコピー


コードは次のとおりです。




5. ブラウザのデフォルト動作をリロードします。
ブラウザにはすべてこのデフォルト動作があります。つまり、 タグをクリックすると、href 属性のアドレスにリンクされることがあります。これは発生したくないが、警告ボックスをポップアップするなどの独自の効果を実装したいと考えています。例は次のとおりです。
コードをコピー コードは次のとおりです:

ブラウザのデフォルト動作を再読み込み
🎜>

7 、バインド イベント リスナー




コードをコピー


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


//addEventt() イベントを追加します
//Scott Andrew のオリジナルの addEvent() 関数
//elm 要素、document.getElementId('btn1')
//evType イベント名を入力してください「onclick」は「click」に、「onblur」は「blur」に変更する必要があることに注意してください。これは、イベント名に「on」が含まれないことを意味します。Click
///fn はもちろんです。 showalert
/ /useCapture のように、バインドされた関数の後に括弧を付けないでください。イベントの応答シーケンスを示すブール値です。userCapture が true の場合、ブラウザーは Capture を使用し、false の場合、バビング メソッドを使用します。 false
function addEvent(elm, evType, fn, useCapture)
{
if (elm.addEventListener) {//firefox、navigation などを使用することをお勧めします。elm.addEventListener(evType, fn, useCapture); } else if (elm.attachEvent) {//IE var r = elm.attachEvent('on' evType,fn );
}
else
{
elm['on' evType] = fn;
}
}
//removeEvent() ログアウト イベント
//パラメータ名は addEvent() と同じです function
function RemoveEvent(elm, evTye, useCapture)
{
if (elm.detachEvent)
{
elm.detachEvent('on' evType );
}
else if (elm.removeEventListener)
{
elm.removeEventListener(evType , userCapture);

関連ラベル:
ソース:php.cn
前の記事:WEBページサブウィンドウ(showModalDialog、showModelessDialog)の使い方_基礎知識 次の記事:JavaScript スプリングオシレーターの超簡易バージョンは、省エネルギーとフックの定理_javascript スキルに完全に準拠しています
このウェブサイトの声明
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。
著者別の最新記事
最新の問題
関連トピック
詳細>
人気のおすすめ
人気のチュートリアル
詳細>
最新のダウンロード
詳細>
ウェブエフェクト
公式サイト
サイト素材
フロントエンドテンプレート