jQuery 이벤트 추가 문제

Question

연습용 카드 게임 디자인을 만들려고 노력 중이며 손으로 애니메이션을 추가하는 데 어려움이 있습니다. 한번은 append를 사용하고 심지어 짝수 처리기를 추가하는 것이 효과적 일 것이라고 생각했지만, 마지막으로 추가 된 요소 (이 경우 li)에서만 작동합니다. 여기

.. 코드를 쉽게 테스트 jsfiddle에 코드입니다 :

$('.deck .card').on('click', function() { 
    // $(this).appendTo('.hand') 
    $('.hand').append(this) 
    $('.hand .card').on('click', function(){ 
     $(this).addClass('flip') 
    }) 
}) 

나는 갑판 밖에 손에 대한 클릭 이벤트를 이동했지만, 전혀 작동하지 않았다. 또한 여기 jsfiddle의 코드를 사용하여보다 쉽게 ​​테스트 할 수 있습니다. http://jsfiddle.net/FAZUc/9/

감사합니다.

Answer 1

클릭 된 요소에서 클릭 이벤트를 제거한 다음 클릭 한 요소에만 새 클릭 이벤트를 추가하십시오.

$('.deck .card').on('click', function() { 
    // $(this).appendTo('.hand') 
    $('.hand').append(this) 
    $(this).off('click').on('click', function(){ 
     $(this).addClass('flip') 
    }) 
}) 

http://jsfiddle.net/FAZUc/16/

이벤트 대표단은 더욱 쉬워집니다.

$('.deck').on('click', '.card', function() { 
    $('.hand').append(this) 
}); 
$('.hand').on('click','.card', function(){ 
    $(this).addClass('flip') 
}); 

http://jsfiddle.net/FAZUc/18/