jQuery 이벤트 흐름의 순서에 대한 자세한 설명

jQueryevent흐름 시퀀스 및 기타 리소스를 제공하세요. 이 사이트를 북마크에 추가하실 수 있습니다. 최신 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 중국어 웹사이트의 기타 관련 기사를 참조하세요!