jQueryのイベントフローの順序を詳しく解説

jQueryイベントフローシーケンスとその他のリソースを提供します。このサイトをブックマークしてください。最新のjQueryイベントフローシーケンスリソース

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

テストコード

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') })

トリガーされた結果:

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

を提供します。

W3Cのイベントフローによれば、ターゲットがキャプチャされてバブリングされています

p,ulノードが#test pノードよりも先にターゲットに接触していることがわかりますが、p,ulは#aaron pにバインドされているため、バブリングしているため、

優先度 は #test

よりも低くなりますが、同じ要素の優先度は要素のネスト順序に基づきます。とにかく、文がターゲットに近ければ近いほど、より早くトリガーされます

以上がjQueryのイベントフローの順序を詳しく解説の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。