선택기가 생기는 jQuery 이벤트 위임?

Question

생성 된 새 DOM 요소의 텍스트를 변경하고 싶습니다. 예컨대 :

$('body').on('creation', '.change-this', function() { 
    $(this).text('Boom!'); 
}); 

그래서

(진짜 API, I 실현) 내가 프로그래밍 <p class="change-this">를 생성하고 (그렇지 않으면 jQuery를 또는를 통해) DOM에 추가하는 경우, 위의 불 끕니다. jQuery가 할 수있는 일인가요? 내가 생각할 수있는 것은, 프로그래밍 방식으로 HTML을 추가하여 $.trigger('creation')을 수행하고 처리기가 해당 이벤트를 처리 할 준비가되어있는 것입니다.

Answer 1

당신의 새로운 아이템을 추적하고 싶습니까? 사용자 정의 이벤트를 사용하여이를 수행 할 수 있습니다. jQuery를 사용하고 있으므로 .trigger() 메서드를 사용하여 이벤트를 만들 수 있습니다.

예를 들어, 요소를 만들 때마다 이벤트를 트리거해야합니다. 그래서, 코드에서이 같은 뭔가를 추가합니다 :

... // Your code goes here 
new_item = '<p class="change-this">'; // The DOM that you will inject 
container.append(new_item); // Injecting item into DOM 
container.trigger('creation', []); // Firing a event signaling that a new item was created 
... 

을 그런 다음이 사용자 정의 이벤트에 대한 리스너를 만듭니다 :

container.on('creation', function() { 
    console.log("Yay! New item added to container!"); 
}); 

확인이 조각 :

$('#add').on('click', function() { 
 

 
    var item = '<p>New item</p>', 
 
     container = $('#container'); 
 
    
 
    container.append(item); 
 
    container.trigger('creation'); 
 
}); 
 

 

 
$('#container').on('creation', function() { 
 
    var new_message = 'New Item added!<br>'; 
 
    
 
    $('#message').append(new_message); 
 
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<button id="add">add</button> 
 
<b id="message"></b> 
 
<div id="container"></div>

이메일을 추적하려면 사용자 정의 트랙이있는 경우 다른 사용자 정의 이벤트를 작성하고 트리거를 처리하면됩니다.

그래서, 그게 전부입니다. jQuery는 사용자 정의 이벤트를 사용하는 간단하고 아름다운 방법을 제공합니다. 굉장해!

자세한 내용

, 이러한 링크를 확인 할 수 있습니다 : - http://api.jquery.com/trigger/

소개 사용자 정의 이벤트 - jQuery.trigger()를 http://learn.jquery.com/events/introduction-to-custom-events/

맞춤 이벤트 - https://developer.mozilla.org/en-US/docs/Web/API/CustomEvent

행운을 빕니다!