javascript - Ajaxify 链接，以便它仍然可以在单击时访问地址，但不会更改页面

Question

我有一个可以从购物车中删除商品的链接，但当您单击该链接时，它会将您重定向到购物车，并且该商品现已被删除。是否可以做到这样，您仍然可以单击它，它仍然可以执行其操作，但不会更改页面(即，它不会将用户发送到购物车)？

注意:我正在 Shopify 上使用 Liquid

链接:

<a href="/cart/change?line={{ forloop.index }}&amp;quantity=0" class="cart__remove">
                <small>{{ 'cart.general.remove' | t }}</small>
</a>

Answer 1

既然你已经包含了 jQuery，请尝试添加以下脚本

jQuery(function($){
  $(document).on('click', 'a.cart__remove', function(e){
     e.preventDefault();
     var url = this.href;
     $.get(url, function(html){
       // here you know that the page the link was pointing to has executed
       // you might need to reload your card or parse it from the html you get here
       // because the index of the cart items has changed after removing one of them
       // and because you also need to update your shown cart to hide/remove the item that was selected

     });
  });
});