jQuery追加事件問題

Question

我試圖構建一個練習卡牌遊戲設計，並且我堅持添加手動畫。曾經，我認爲使用append然後添加even處理程序是可行的，但事實證明它只適用於最後添加的元素（在本例中爲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

從單擊的元素中移除click事件，然後將新的click事件添加到單擊的元素。

$('.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/