Detaillierte Erläuterung der Reihenfolge des jQuery-Ereignisflusses

Stellt Ihnen jQueryEreignissequenzen und andere Ressourcen zur Verfügung. Sie können diese Website gerne mit Ihren Lesezeichen versehen. Wir stellen Ihnen die neuesten jQuery-Ereignisflusssequenzressourcen zur Verfügung

<p id="aaron">    <p id=&#39;test&#39;>         <ul>             <p>点击p被委托,ul被阻止了,因为内部重写了事件对象</p>         </ul>    </p> </p>v>

Testcode

var aaron = $("#aaron") //同一个元素上绑定不同的事件委托 aaron.on('mousedown','p',function(e){     console.log('委托到p触发')   // e.stopPropagation() }) aaron.on('mousedown','ul',function(e){     console.log('被阻止了') })  aaron.on('mousedown',function(e){   console.log('mousedown') })  $("#test").on('mousedown',function(){   console.log('test') })  $("body").on('mousedown',function(){   console.log('body') })

ausgelöste Ergebnisse:

test 委托到p触发 被阻止了 mousedown body

Entsprechend dem Ereignisfluss von

W3C das Ziel zum Blasen erfassen

Sie können sehen, dass der

p,ul-Knoten das Ziel früher kontaktiert als der #test p-Knoten, aber da p,ul eine Blase ist, die an #aaron p gebunden ist, also

Priorität sollte niedriger sein als #test

, aber die Priorität desselben Elements basiert auf der Verschachtelungsreihenfolge der Elemente. Je näher ein Satz am Ziel ist, desto eher wird er ausgelöst

Das obige ist der detaillierte Inhalt vonDetaillierte Erläuterung der Reihenfolge des jQuery-Ereignisflusses. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!