作为我正在制作购物车的uni项目,到目前为止,您可以将产品添加到购物车,如果您刷新页面,则可以从购物车中删除商品。
但是当项目添加到购物篮时,如果没有先刷新浏览器,则无法将其从购物车中删除。那是为什么?
这是我的删除项目表格购物车功能
$('.del').on("click",function(){
var id= this.id;
var productId = $('#productId-'+id).text();
var productPrice = $('#price-'+id).text();
var total = $('#total').text();
var newPrice = (parseFloat(total) - parseFloat(productPrice)).toFixed(2);
var dataString = 'id='+ id;
cartSize--;
$('#total').html(newPrice);
$("#cart-"+id).slideUp('slow', function() {$(this).remove();});
$.ajax({
type: "POST",
url: "resources/del.php",
data: dataString,
cache: false,
success: function(html){
$('#added-'+productId).fadeOut('Fast');
$('#product-'+productId).delay(600).fadeIn('Fast');
if(cartSize == 0){
$('#noItems').fadeIn('Fast');
$('#mainCart').fadeOut('Fast');
}
}
});
return false;
});
});
并且我的添加到购物车功能:
$('.addToCart').click(function(){
var id = this.id;
var price = parseFloat($('#priceAdd-'+id).val()).toFixed(2);;
var name = $('#name-'+id).val();
var total =(parseFloat($('#total').text())+parseFloat(price)).toFixed(2);
cartSize++;
$('#product-'+id).fadeOut('fast');
$('#added-'+id).delay(500).fadeIn('fast');
$.ajax({
type: "POST",
url: 'resources/addToCart.php',
data: { itemId: id , name: name, price: price},
cache: false,
success: function(html){
$("ol").append(html).slideDown("slow");
$('#noItems').fadeOut('fast');
$('#total').html(total);
$('#mainCart').fadeIn('fast');
}
});
});
非常感谢任何输入。
答案 0 :(得分:3)
您需要使用.on()
,以便它适用于将来的元素,就像使用已弃用的 .live()
函数一样。
N.B。 .on()不仅仅是.live()的别名,语法也不同。
$(document).on('click', '.del', function(){...});
我在那里使用过文档,但最好选择一个元素作为你动态创建的元素的较近父元素,例如。
$('#basket').on('click', '.del', function(){...});
答案 1 :(得分:2)
您不想使用.live()
,因为:“从jQuery 1.7开始,不推荐使用.live()方法。”
您想使用.on()
$('#myListItems').on("click", ".del" ,function(e) {
$(e.target).remove()
});