只替换一个元素而不是全部

好的，我在发布之前自己试过，但是在这里我碰到了一堵墙。只替换一个元素而不是全部

我的产品的列表，每个产品都有一个“放入购物车”按钮/图像，我想该图像与被替换“项目添加到购物车”的形象。

我遇到的问题是，当我替换一个图像时，所有图像都被替换。现在你可以知道我是多么新的jQuery了。

这是我的jQuery：

//Replace the 'Add To Cart' button 
$('.add-to-cart-btn').click(function(){ 
    $('.add-to-cart-btn').replaceWith('<img src="images/button-added-to-cart.png" alt="Item added to Cart">'); 
return false; 
});

这里是我的HTML：

<a href="#" class="add-to-cart-btn"><img src="images/button-add-to-cart.png" alt="Add to Cart"></a>

正如你所看到的，我更换整个AHREF元素，因为当添加的项目，我不t希望该按钮可以再次点击。

任何想法如何使一个特定的“添加到购物车”按钮/图像被取代，而不是所有的按钮？

感谢您给我的任何帮助和指导。

来源

2011-01-07 Ricardo Zea

您只想替换您选择的项目（AKA，被点击的项目），因此不要再次进行选择，而是使用被点击的对象（this）。

//Replace the 'Add To Cart' button 
$('.add-to-cart-btn').click(function(){ 
    $(this).replaceWith('<img src="images/button-added-to-cart.png" alt="Add to Cart">'); 
return false; 
});

来源

2011-01-07 19:53:45 JasCav

$（本），卫生署！哇，现在我知道了。感谢您的帮助JasCav。 – 2011-01-07 19:56:11

JasCav，我在想：如果我想淡入新形象怎么办？我试过“$（this）.fadeIn（''）;”但它不起作用。提前致谢。 – 2011-01-10 15:54:14

我认为更有效的方式来做到这一点是：

$('.add-to-cart-btn').click(function() { 
    this.src = 'images/button-added-to-cart.png'; 
    this.alt = 'Item added to Cart'; 
    return false; 
});

来源

2011-01-07 19:58:52

只替换一个元素而不是全部

回答

相关问题