添加到购物车点击后删除不起作用，但刷新页面后工作正常答案

【问题标题】：Delete is not working after add to cart click but works fine after refreshing page添加到购物车点击后删除不起作用，但刷新页面后工作正常
【发布时间】：2014-01-15 07:27:54
【问题描述】：

我有一个购物车页面，如果我点击添加到购物车然后删除使页面刷新，如果在添加到购物车后我重新加载页面删除效果很好，没有页面刷新。我认为 jquery 处理程序有任何问题，但我已经尝试了所有代替“文档就绪”的方法，例如窗口加载等。

这是我的代码脚本

$(document).ready(function(){
  $('a.delete').on("click", function(e) {
    e.preventDefault();
    var parent = $(this).parent();
    $.ajax({
      type: 'get',
      url: 'index.php',
      data: 'ajax=1&delete=' + parent.attr('id').replace('record-',''),
      beforeSend: function() {
        parent.animate({'backgroundColor':'#fb6c6c'},300);
      },
      success: function() {
        parent.slideUp(300,function() {
          parent.remove();
        });
      }
    });
  });

  $(".AddToCart").on('click',function() {
    var productId = this.id;
    var check_realtor = $(this).next('input').next('input').next('input').next('select.realtor').val();
    $('#labee_'+productId).val(check_realtor);
    var FormData = $('#productAddCart_'+productId).serialize();
    $.ajax({  
      type: "POST",  
      url: "functions.php?action=addToBasket",  
      data:FormData, 
      beforeSend:function(){$("#submit_indicator").show();},
      success: function(cartproduct) {
        //location.reload();
        $("#submit_indicator").hide();
        $(".shoping_cart").html(cartproduct);
      } 
    });
  })
});

这里是删除<a href="?delete=',$cartdata->id,'" onclick="return:false" class="delete">Delete</a>的html标记

这是添加到购物车按钮<button id="<?php echo $proDuctName->id;?>" type="button" class="btn btn-danger AddToCart"> <span class="glyphicon glyphicon-shopping-cart"></span> Add to Cart</button>的标记

【问题讨论】：

你能添加你的标记吗？一旦你在你的页面上修复它，一个指向你页面的链接对其他 StackOverflowers 没有好处。这里的答案不仅可以帮助您，还可以帮助其他有类似问题的人。请为您的页面提供标记，我们可能会提供帮助。
@DutGRIFF 我已经添加了我用来调用上述 jquery ajax 脚本的元素，因为所有标记都有很多 php 和内联 css，所以它会造成混淆。你现在能帮我吗？
如果这回答了您的问题，您应该通过单击有帮助的答案旁边的复选标记来接受它。如果没有，请让我知道您需要什么帮助。我注意到您从未接受过答案或对您的任何问题进行投票。请开始尽自己的一份力量，以便我们知道这些问题已得到解答。

标签： jquery

【解决方案1】：

为了防止页面提交，您可以使用e.preventDefault()，但您还希望在该函数的末尾包含return false;。试试这个

$('a.delete').on("click", function(e) {
  e.preventDefault();
  var parent = $(this).parent();
  $.ajax({
    type: 'get',
      url: 'index.php',
      data: 'ajax=1&delete=' + parent.attr('id').replace('record-',''),
      beforeSend: function() {
      parent.animate({'backgroundColor':'#fb6c6c'},300);
    },
    success: function() {
      parent.slideUp(300,function() {
        parent.remove();
      });
    }
  });
  return false; //<<<< Add this line here
});

但您也不希望链接提交到新页面。你告诉它提交给"?delete=',$cartdata->id,'"。所以把它改成空白，然后像这样添加onclick="return:false"：

<a href="" onclick="return:false" class="delete">Delete</a>

【讨论】：

感谢帮助但它没有效果页面仍然在刷新，就像我从锚点中删除了 url 所以它不会删除记录并且刷新后它可以工作。我认为这个问题是为了添加到购物车 ajax 调用而造成的，因为之后出现问题并且我的删除功能不起作用
我无法理解该评论，但这确实有效。我在你的网站上试过了。根据您对实时站点的当前修订，您删除了onclick="return:false"。你应该把它放回去，就像我有它一样。完成上述所有编辑后，如果仍然无法正常工作，请告诉我，我会查看您的网站。注意事项：在您的实时网站上，您需要编辑购物车总数。您应该在 parent.remove() 之后的 ajax 调用成功内执行此操作。
@Omprks 我可以看到此更改对您有用。如果它回答了您的问题，您应该接受它。如果你觉得它很有帮助，你应该给它一个赞成票。我可以通过查看您的历史来判断您从不支持或接受答案，这对您很粗鲁。