JSは発泡防止とデフォルトイベントのキャンセル(デフォルト)
4517 ワード
原文のリンク:http://www.cnblogs.com/best-coder/p/11550459.html
原文のリンク:http://caibaojian.com/javascript-stoppropagation-preventdefault.html
js泡立ちと捕獲はイベントの2つの行為であり、event.stopPropagationを使用して捕獲と発泡段階における現在のイベントのさらなる伝播を阻止する。event.prevent Default()を使用して、デフォルトイベントをキャンセルすることができます。発泡と捕獲の優先順位については、前の記事をご覧ください。JavaScript捕獲と発泡検討
泡の発生と捕獲を防ぐ
w 3 cの方法はe.stopPropagation()で、IEはe.ccel Bbble=trueを使用します。
stopPropagationもイベントオブジェクト(Event)の一つの方法であり、ターゲット要素の発泡イベントを阻止する役割を果たしていますが、デフォルトの行動は阻止されません。何が泡事件ですか?一つのボタンが「click」イベントと結合されているように、「click」イベントは、その親レベル要素の中で順次トリガされる。stopPropagationとは、ターゲット要素のイベントを父のレベルに浸漬させないことです。例えば:
バブル事件泡を止める・
デフォルトのイベントをキャンセル
w 3 cの方法はe.preventDefault()で、IEはe.return Value=falseを使う。
preventDefaultはイベントオブジェクト(Event)の一つの方法であり、ターゲット要素のデフォルトの挙動をキャンセルする役割を果たしています。デフォルトの行为である以上、もちろん要素はデフォルト行为がないとキャンセルされません。要素自体にデフォルト行为がないと、当然呼び出しは无効になります。どのような要素にデフォルトがありますか?リンクを選択します。Eventオブジェクトのcancenlableがfalseである場合、デフォルトの動作がないことを表します。たとえデフォルトの行為があっても、prevent Defaultを呼び出しても機能しません。
私たちは全部知っています。リンクのデフォルトの動作は指定ページにジャンプします。これを例にとってジャンプを阻止します。
return false
javascriptのreturn falseはデフォルトの行為を阻止するだけでなく、jQueryを使えばデフォルトの行為を阻止しつつ、オブジェクトの泡が発生するのを防止します。
以下のこれは原生jsを使って、デフォルトの行為を阻止するだけで、泡が立つことを停止しません。
原文のリンク:http://caibaojian.com/javascript-stoppropagation-preventdefault.html
js泡立ちと捕獲はイベントの2つの行為であり、event.stopPropagationを使用して捕獲と発泡段階における現在のイベントのさらなる伝播を阻止する。event.prevent Default()を使用して、デフォルトイベントをキャンセルすることができます。発泡と捕獲の優先順位については、前の記事をご覧ください。JavaScript捕獲と発泡検討
泡の発生と捕獲を防ぐ
w 3 cの方法はe.stopPropagation()で、IEはe.ccel Bbble=trueを使用します。
stopPropagationもイベントオブジェクト(Event)の一つの方法であり、ターゲット要素の発泡イベントを阻止する役割を果たしていますが、デフォルトの行動は阻止されません。何が泡事件ですか?一つのボタンが「click」イベントと結合されているように、「click」イベントは、その親レベル要素の中で順次トリガされる。stopPropagationとは、ターゲット要素のイベントを父のレベルに浸漬させないことです。例えば:
- test
上記のコードは、Demo以下のとおりです。testをクリックすると、順次alert(「li」)、alert(「ul」)、alert(「div」)がトリガーされます。バブル事件泡を止める・
window.event? window.event.cancelBubble = true : e.stopPropagation();
発泡停止 デフォルトのイベントをキャンセル
w 3 cの方法はe.preventDefault()で、IEはe.return Value=falseを使う。
preventDefaultはイベントオブジェクト(Event)の一つの方法であり、ターゲット要素のデフォルトの挙動をキャンセルする役割を果たしています。デフォルトの行为である以上、もちろん要素はデフォルト行为がないとキャンセルされません。要素自体にデフォルト行为がないと、当然呼び出しは无効になります。どのような要素にデフォルトがありますか?リンクを選択します。Eventオブジェクトのcancenlableがfalseである場合、デフォルトの動作がないことを表します。たとえデフォルトの行為があっても、prevent Defaultを呼び出しても機能しません。
私たちは全部知っています。リンクのデフォルトの動作は指定ページにジャンプします。これを例にとってジャンプを阻止します。
// caibaojian.com
var a = document.getElementById("testA");
a.onclick =function(e){
if(e.preventDefault){
e.preventDefault();
}else{
window.event.returnValue == false;
}
}
デモ:リンクのジャンプを阻止するデフォルトの行動caibaojian.comreturn false
javascriptのreturn falseはデフォルトの行為を阻止するだけでなく、jQueryを使えばデフォルトの行為を阻止しつつ、オブジェクトの泡が発生するのを防止します。
以下のこれは原生jsを使って、デフォルトの行為を阻止するだけで、泡が立つことを停止しません。
//code from http://caibaojian.com/javascript-stoppropagation-preventdefault.html
var a = document.getElementById("testB");
a.onclick = function(){
return false;
};
: ,
jQuery,
$("#testC").on('click',function(){
return false;
});
:
,
function stopBubble(e) {
// , IE
if ( e && e.stopPropagation )
// W3C stopPropagation()
e.stopPropagation();
else
// , IE
window.event.cancelBubble = true;
}
,
//
function stopDefault( e ) {
// (W3C)
if ( e && e.preventDefault )
e.preventDefault();
//IE
else
window.event.returnValue = false;
return false;
}
- event , event 、 、 ;
- event 。
firefox event IE ,IE , ;firefox , 。
IE/Opera window.event, Firefox event; , IE window.event.srcElement, Firefox event.target,Opera 。
- :
function a(e){
var e = (e) ? e : ((window.event) ? window.event : null);
var e = e || window.event; // firefox window.event null, IE event null
}
-
-
- return false
-
-
:http://caibaojian.com/javascript-stoppropagation-preventdefault.html
:https://www.cnblogs.com/best-coder/p/11550459.html
・