Jquery에서 바인딩과 켜기의 차이점은 무엇입니까

jquery에서 바인딩과 on의 차이점은 on 바인딩에 바인딩 바인딩보다 childSelector 매개변수가 하나 더 많다는 것입니다. 바인딩은 조건에 맞는 요소 자체에만 이벤트를 추가할 수 있고, on에서는 하위 요소의 이벤트를 상위 요소에 위임하여 처리할 수 있습니다.

환경:

이 문서는 모든 브랜드의 컴퓨터에 적용됩니다.

(권장 튜토리얼: jquery 비디오 튜토리얼)

차이 분석:

bind와 on은 모두 이벤트를 요소에 바인딩하는 데 사용됩니다. 가장 큰 차이점은 이벤트 버블링입니다.

이벤트 버블링은 위임된 이벤트의 프로토타입이기도 합니다. 이벤트 위임은 하위 클래스의 항목을 상위 클래스에 위임하는 것을 의미합니다. 가장 직관적인 차이점은 바인딩 시 바인딩 바인딩보다 'childSelector' 매개변수가 하나 더 많다는 것입니다.

구문: ​​

$(selector).on(event,childSelector,data,function)

매개변수:

$(selector).bind(event,data,function,map)

매개변수:

bind는 조건을 충족하는 요소 자체에만 이벤트를 추가할 수 있으며, on에서는 하위 요소의 이벤트를 상위 요소에 위임할 수 있습니다. 처리하고, 동적으로 추가된 요소에 바인딩 이벤트를 추가할 수 있습니다

즉, 새로 추가된 요소가 바인딩되면 조건에 맞는 새 요소도 바인딩되면 새 요소가 바인딩되지 않습니다. 체하는.

예:

<ul>
    <li>第一个子元素<li/>
    <li>第二个子元素<li/>
    <li>第三个子元素<li/>
</ul>

모든 li에 클릭 이벤트를 추가하려고 합니다. on:

 $('ul').on('click','li', function () {   
        console.log($(this).text());
});

을 사용할 수도 있고, 바인드:

 $('ul li').bind('click', function () { 
        console.log($(this).text());
});

를 사용할 수도 있습니다.

on을 사용한 첫 번째 바인딩은 실제로 부모에게 위임합니다. .ul, 즉 이벤트는 하나의 요소에만 바인딩됩니다

두 번째는 선택기를 사용하여 ul 아래의 모든 li 요소를 선택하고 이벤트를 차례로 바인딩하는 것입니다

하위 요소가 너무 많으면, 차이가 매우 크면 바인드가 성능에 심각한 영향을 미칩니다!

이번에 새 li가 추가되면:

$(&#39;ul&#39;).append(&#39;<li>第四个子元素<li>&#39;)；

바인드되면 이 리에도 클릭 이벤트가 발생합니다. 클릭 이벤트가 발생하지 않습니다.

관련 권장 사항: js 튜토리얼

위 내용은 Jquery에서 바인딩과 켜기의 차이점은 무엇입니까의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!