使用jQuery来回更改类？

嘿，伙计们，我有一个小按钮功能，这不是错误，但也不工作。 addItem被称为fine，并将类从“add button”切换到“in cart button”，但$（“a.in-cart-button”）。单击（…似乎没有触发。当我单击“in cart button”时，它会再次触发addItem函数…有什么想法吗

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);
});

谢谢！

在最初发现元素时（通过它们最初拥有的类），您需要在这里使用以下内容：

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

当元素的类更改时，它不会对处理程序产生影响，重要的是调用

$（“a.add-button”）

和

$（“a.in-cart-button”）时，哪些元素具有类

，它找到了元素并绑定到这些元素上……之后元素会发生什么并不重要，绑定到元素而不是类的处理程序。当您单击时，它会检查类：）

而不是在最初找到元素时绑定元素（它们最初由哪些类绑定），您需要如下所示：

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

---

当元素的类更改时，它不会对处理程序产生影响，重要的是当您调用

$（“a.add-button”）

和

$（“a.in-cart-button”）

时，哪些元素拥有类，它会找到元素并绑定到这些元素……之后元素会发生什么并不重要，绑定到元素而不是类的处理程序。当您单击时，它会检查类：）

，这是因为当页面加载时，

in cart按钮不在页面上，因此处理程序没有附加

只需将一个函数与
toggleClass（）
配合使用即可


其他选项是使用
.toggle（）
而不是接受2个（或更多）函数的
.click（）

此外，您还可以将对函数的引用作为
.click（）
处理程序传递，并且仍然可以访问
事件
对象

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);

这是因为当页面加载时，
in-cart按钮
还不在页面上，因此处理程序没有附加

只需将一个函数与
toggleClass（）
配合使用即可


其他选项是使用
.toggle（）
而不是接受2个（或更多）函数的
.click（）

此外，您还可以将对函数的引用作为
.click（）
处理程序传递，并且仍然可以访问
事件
对象

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);

尝试将实时事件附加到
尝试将实时事件附加到
事件委派基本上就是您想要的

活动授权基本上就是您想要的

我不知道，感谢您的澄清，这非常有效！感激..现在不推荐使用live（），请改用.on（）！和平。我不知道，谢谢你的澄清，这是完美的作品！感激..现在不推荐使用live（），请改用.on（）！和平。我认为OP在这两种方法中做了额外的工作，例如
alert（）
…但是你可以在任何一种情况下将
this
传递给该方法：）@Nick-可能是。OP可以在下一行执行
.hasClass（）
，以获取函数中的状态。我有一种感觉，ID是
元素的ID，这当然会使事情更加简化。我认为OP在这两种方法中做了额外的工作，例如
警报（）
…但在任何情况下，您都可以将
此
传递给方法：）@Nick-可能是。OP可以在下一行执行
.hasClass（）
，以获取函数中的状态。我有一种感觉，ID是
元素的ID，这当然会使事情更加简化。