복붙노트

[JQUERY] 합니까 jQuery.on () 이벤트 핸들러 이후에 추가되는 요소에 대한 작업이 생성됩니다?

JQUERY

합니까 jQuery.on () 이벤트 핸들러 이후에 추가되는 요소에 대한 작업이 생성됩니다?

해결법


  1. 1.제대로 사용하는 경우 CSTE 연구진은 () 동적으로 생성 된 요소와 함께 작동합니다. JQuery와 문서는 그것을 설명하는 아주 좋은 일을한다.

    제대로 사용하는 경우 CSTE 연구진은 () 동적으로 생성 된 요소와 함께 작동합니다. JQuery와 문서는 그것을 설명하는 아주 좋은 일을한다.

    동적 요소를 사용하는 방법은이 형태를 사용한다 :

    $("static selector").on('click', "dynamic selector", fn);
    

    정적 선택은 동적 객체의 조상 둘 다 정적 일부 개체를 해결해야합니다 - 당신이 코드 줄을 실행하고 제거하거나 다시하지 않을 때는 존재합니다.

    동적 선택은 동적 요소와 일치하는 선택이다. 그들은 이벤트 핸들러가 처음 설치 될 때 존재하지 않아도 그들이 와서 자주 당신이 원하는대로 갈 수 있습니다.

    "#container는"정적 조상과 일치한다면, ".foo는"당신은 당신이 사용하는 것에 대한 핸들러를 클릭하여 원하는 동적 요소를 일치;

    $("#container").on("click", ".foo", fn);
    

    당신이 정말로 그것을 이해하려면,이 CSTE 연구진의 처리 위임 된 이벤트가 () 작동 방법이다. 위의 CSTE 연구진 () 전화를 걸 때, #container 개체에 클릭 이벤트 처리기를 부착. 클릭이 조상 체인을 거품 그래서 얼마 후 당신이 .foo 객체를 클릭하면 실제 .foo 객체에는 클릭 핸들러가 없습니다. 클릭이 #container 객체에 도달하면,이 클릭 핸들러와 jQuery를 그 핸들러를 살펴보고이 핸들러는 원래 클릭-에 객체가 선택 ".foo"를 일치하는 객체에 대해서만 것으로 본다. 그것은 그 셀렉터에 일치 않으며, 만약 그렇다면, 그것의 이벤트 핸들러가 호출하는 경우 볼 수있는 이벤트 대상을 테스트합니다.

    (현재 사용되지 않음) .live () 메서드는 문서 객체에 대한 모든 이벤트 핸들러를 부착하여 일했다. 문서 객체는 문서의 모든 개체의 조상이기 때문에, 그들은 그런 식으로 이벤트 처리를 위임 받았습니다. 따라서, 위의 예에서,이 두 가지가 동일합니다

    $(document).on("click", ".foo", fn);
    $(".foo").live("click", fn);
    

    그러나, 문서의 모든 위임 된 이벤트 처리기를 부착 jQuery를 그것을 할 나쁜 방법이라고 결정했습니다, 그래서 때로는 심각한 성능 병목을 만들고 그것을 가까이 실제 대상 개체보다 희망했다 정적 조상을 지정할 개발자를 필요로하는 것이 더 있었다 문서 객체입니다.


  2. 2.난 당신이 내가 직면 한 비슷한 상황에 직면 생각합니다. 이 나중에 생성 된 요소 가지 이벤트를 바인딩에 매우 좋은 솔루션입니다.

    난 당신이 내가 직면 한 비슷한 상황에 직면 생각합니다. 이 나중에 생성 된 요소 가지 이벤트를 바인딩에 매우 좋은 솔루션입니다.

    다른 이벤트를 통해 생성 된 요소에 바인딩 JQuery와 이벤트

  3. from https://stackoverflow.com/questions/9814298/does-jquery-on-work-for-elements-that-are-added-after-the-event-handler-is-cre by cc-by-sa and MIT license