使用jQuery來回更改類？

嘿傢伙，我有一個小按鈕的功能，沒有犯錯，但也沒有工作。 addItem被調用的很好，並將類從「add-button」切換到「in-cart-button」，但$（「a.in-cart-button」）。click（...似乎沒有被射擊。當我點擊「正在購物車按鈕」，而是再次觸發的addItem功能...任何想法？使用jQuery來回更改類？

function addItem(t_id) { 
    $("#" + t_id).addClass("in-cart-button").removeClass("add-button"); 
} 

function removeItem(t_id) { 
    $("#" + t_id).addClass("add-button").removeClass("in-cart-button"); 
    alert("Remove item with id: " + t_id); 
} 

$("a.add-button").click(function(event) { 
    event.preventDefault(); 
    addItem(event.target.id); 
}); 

$("a.in-cart-button").click(function(event) { 
    event.preventDefault(); 
    removeItem(event.target.id); 
});

謝謝！

來源

2010-08-13 TwstdElf

代替.click()結合時的元素他們最初被發現（他們最初是通過哪些類別），您需要在此處使用.live()，如下所示：

$("a.add-button").live('click', function(event) { 
//and 
$("a.in-cart-button").live('click', function(event) {

隨着.click()當元素的類更改它不會影響處理程序，所有重要的是當您調用$("a.add-button")和$("a.in-cart-button")哪些元素有類時，它發現元素並綁定到那些...什麼發生在元素之後並不重要，處理程序綁定到元素，而不是類。隨着.live()它檢查類，當你點擊:)

來源

2010-08-13 17:40:18

不知道，謝謝你的澄清，這完美的作品！讚賞。 – TwstdElf 2010-08-13 17:43:04

@TwstdElf - Welcome :) – 2010-08-13 17:44:53

.live（）現在不推薦使用.on（）代替！和平。 – ColossalChris 2015-02-04 00:38:12

這是因爲當頁面加載，in-cart-button不在頁面上，所以處理程序沒有附加。

僅使用toggleClass()的一個函數。

function toggleItem(event) { 
    $("#" + t_id).toggleClass("add-button in-cart-button"); 
} 

$("a.add-button").click(function(event) { 
    event.preventDefault(); 
    toggleItem(event.target.id); 
});

其他選項是使用.toggle()代替.click()它接受2（或更多）的功能。

此外，您可以將該函數的引用作爲.click()處理函數傳遞，並且仍然可以訪問event對象。

function toggleItem(event) { 
    event.preventDefault(); 
    var $target = $("#" + event.target.id); 
    $target.toggleClass("add-button in-cart-button"); 
    if($target.hasClass('in-cart-button')) 
     alert("Remove item with id: " + t_id); 
} 

$("a.add-button").click(toggleItem);

來源

2010-08-13 17:41:31 user113716

我認爲OP在這兩種方法中做了額外的工作，例如'alert（）'...但你可以在這種情況下將'this'傳遞給方法:) – 2010-08-13 17:43:55

@Nick - 可能是。 OP可以在下一行執行'.hasClass（）'來獲取函數中的狀態。我覺得ID是''元素的ID，這當然會更簡化。 – user113716 2010-08-13 17:48:25