jQuery：任何方式來「刷新」事件處理程序？

Question

我有兩個div，一個擁有一些東西，另一個擁有所有可能的東西。點擊其中一個div將傳送項目到其他div。我想出的代碼是：

$("#holder > *").each(function() { 
    $(this).click(function(e) { 
     $(this).remove(); 
     $("#bucket").append(this); 
    }); 
}); 

$("#bucket > *").each(function() { 
    $(this).click(function(e) { 
     $(this).remove(); 
     $("#holder").append(this); 
     }); 
}); 

這一個完美的作品，除了事件處理程序需要一次我追加或刪除元素被刷新。我的意思是，如果我第一次點擊一個元素，它會被添加到另一個div，但是如果我再次點擊這個元素，什麼都不會發生。我可以手動做到這一點，但有沒有更好的方法來實現這一目標？

Answer 1

嘗試jquery live events .. $ .live（eventname，function）將綁定到任何當前匹配的元素以及未來通過JavaScript操作添加到Dom中的元素。

例如：

$("#holder > *").live("click", function(e) { 
     $(this).remove(); 
     $("#bucket").append(this); 
}); 

$("#bucket > *").live("click", function(e) { 
     $(this).remove(); 
     $("#holder").append(this); 
}); 

重要：

注意$.live已被從jQuery的（1.9以上），並且你應該使用$.on剝離。

我建議你參考this answer瞭解更新的例子。

Answer 2

你看過jQuery的live函數嗎？

Answer 3

編輯：不要使用現場，它被棄用！

利用事件泡沫的優勢。使用.on()：

var = function(el1, el2) { 

var things = $('#holder, #bucket'); 
things.each(function(index) { 
    // for every click on or in this element 
    things.eq(index).on('click', '> *', function() { 
    // append will remove the element 
    // Number(!0) => 1, Number(!1) => 0 
    things.eq(Number(!index)).append(this); 
    }); 
}); 

任何點擊任何元件（存在於綁定的時間或不）將冒泡（假設你沒有手動捕獲的事件並停止傳播）。因此，您可以使用該綁定僅綁定兩個事件，每個容器上一個事件。途經的第二個參數的選擇測試（在這種情況下，每一次點擊，> *，將刪除是元素，然後將其追加到備用容器由things.eq(Number(!index))

Answer 4

在這裏，你去當accesesed，使用更直觀的delegate API： 。

var holder = $('#holder'), 
    bucket = $('#bucket'); 

holder.delegate('*', 'click', function(e) { 
    $(this).remove(); 
    bucket.append(this); 
}); 

bucket.delegate('*', 'click', function(e) { 
    $(this).remove(); 
    holder.append(this); 
}); 

Answer 5

首先，live已被棄用二，耳目一新的是不是你想要的你只需要點擊處理程序附加到右源，在這種情況下：文檔

瓦時。你做

$(document).on('click', <id or class of element>, <function>); 

點擊處理程序附加到文檔。加載頁面後，點擊處理程序將附加到元素的特定實例。當頁面重新加載時，該特定的實例不見了，所以處理程序不會註冊任何點擊。但頁面仍然如此將點擊處理程序附加到文檔。簡單而簡單。