问题描述
我正在购物车上执行一项任务,当我点击 add_cart 按钮时。它应该在购物车图标上显示购物车中存在的商品总数。将商品添加到购物车后,它会显示正确的数量,但是当我单击 cart_details 页面然后按后退按钮时,问题就出现了。它甚至在我将商品添加到购物车之前就显示了旧数字。
$('body').on('click','.cart',function () {
id = $(this).attr("id");
website_id = id.replace("cart_","");
advertiser_id = <?PHP echo $advertiser_id; ?>;
cart_icon_class = $(this).find("img").attr("class");
if(cart_icon_class == "blank_cart"){
action = "add";
}else{
action = "delete";
}
$.ajax({
type: 'POST',url: "{{ route('cartstore') }}",data: {id: website_id,advertiser_id: advertiser_id,action:action,website_id:website_id},dataType: 'json',success: function (data) {
if(action == "add"){
// console.log(data);
$("#cart_span").text(data['carts']);
$("#wishlist_span").text(data['wish']);
$(".Box no-border").hide();
$("#cart-success").show();
$("#cart_icon_" + data["website_id"]).attr("src","{{URL::asset('assets/images/fas-fa-shopping-cart.png')}}");
$("#cart_icon_" + data["website_id"]).removeClass('blank_cart');
$("#cart_icon_" + data["website_id"]).addClass('filled_cart');
$("#wish_icon_" + data["website_id"]).removeClass('fas fa-heart');
$("#wish_icon_" + data["website_id"]).addClass('far fa-heart');
setTimeout(function () {
$('#cart-success').hide();
},1500);
}
else
{
// console.log(data);
$("#cart_span").text(data['carts']);
$("#wishlist_span").text(data['wish']);
$(".Box no-border").hide();
$("#cart-danger").show();
$("#cart_icon_" + data["website_id"]).attr("src","{{URL::asset('assets/images/far-fa-shopping-cart.png')}}");
$("#cart_icon_" + data["website_id"]).removeClass('filled_cart');
$("#cart_icon_" + data["website_id"]).addClass('blank_cart');
setTimeout(function () {
$('#cart-danger').hide();
},1500);
}
$("#cart_span").show();
$("#wishlist_span").show();
if (data['wish'] == 0) {
$("#wishlist_span").css("display","none");
}
if (data['carts'] == 0) {
$("#cart_span").css("display","none");
}
},error: function (error) {
alert("Something went wrong please try again.");
}
});
});
解决方法
if(!!window.performance && window.performance.navigation.type == 2){
window.location.reload();}
这不会重新加载您的页面两次,并且您还会在单击后退按钮后获得更新的数据。