자바 스크립트 코드가 자바 스크립트 코드

Question

이의 또 다른 조각에 의해 생성 된 요소에서 작동하지 않습니다 내가 구현하려고하는 작업입니다 :

이

요소 "A"를 클릭 한 후, jQuery를 예를 들어, 다른 요소를 생성은, "p". 그런 다음 JS에 의해 생성 된 "p"가 클릭되면 msgbox가 나타납니다. 나는 $ ("A")의 이벤트를 제거하면 http://jsfiddle.net/ux3n8/

$(".original").click(function(){ 
 
    var p=$('<p>').text("hahahahahaha"); 
 
    $(p).addClass("createdByJS"); 
 
    $(".main").append($(p)); 
 
}); 
 

 
$(".createdByJS").click(function(){ 
 
    alert("hello World!"); 
 
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<div class="main"> 
 
    <a class="original">test</p> 
 
</div>

JQuery와이 여전히 (함수()을 클릭 만 :

이

은 내가 쓴 예제 코드입니다. "p"를 생성하려면 모든 것이 잘 작동하지만 "a"를 클릭하면 "p"가 생성되면 jQuery 함수를 더 이상 추가 할 수 없습니다.

아직 코딩에 익숙하지 않습니다. 누군가가 그럴 수 있다면 정말 고맙겠습니다. 나는 해결책을 찾는다.

대단히 감사합니다!

Answer 1

delegate이 새로운 요소를 추가 할 때 존재하는 요소에 이벤트가 필요합니다. 이 경우 document.

http://learn.jquery.com/events/event-delegation/

데모 :. 당신은이`$ 같이`.main`에 위임 할 수 http://jsfiddle.net/robschmuecker/ux3n8/2/

$(".original").click(function() { 
    var p = $('<p>').text("hahahahahaha"); 
    $(p).addClass("createdByJS"); 
    $(".main").append($(p)); 
}); 

$(document).on('click', '.createdByJS', function() { 
    alert("hello World!"); 
});