WooCommerce AJAX在我的自定义脚本之后重新加载页面

WooCommerce AJAX reload page after my custom script

本文关键字：加载 新加载 AJAX 我的 自定义 之后 脚本 WooCommerce      更新时间：2023-09-26

我对WooCommerce有问题。我想在单击添加到购物篮按钮后在jQuery中添加一些自定义脚本。没有我的脚本，一切都很好，所以当我单击添加到购物篮时，AJAX 会触发，并且没有页面重新加载，我将我的产品放在篮子里。添加我的jQuery脚本后，它仍然可以工作，但是单击后它会重新加载页面。为什么会这样？

<div class="uk-panel product-panel">
    <a href="#">
        <img width="300" height="300" src="#">
        <h3>Product title</h3>
    </a>
    <a rel="nofollow" href="/sklep/?add-to-cart=138" data-quantity="1" data-product_id="138" data-product_sku="SN435787" class="button product_type_simple add_to_cart_button ajax_add_to_cart k_pri_bg k_pri_contrast" title="Dodaj do koszyka">
        <i class="fa fa-cart-plus"></i>
    </a>
</div>

jQuery

$(document).ready(function(){
    $('.product-panel .add_to_cart_button').click(function() {
        $(this).children('i').remove();
        $(this).append('<i class="fa fa-check-circle-o added-ok"></i>');
        /* Act on the event */
    });
});

使用 event.preventDefault(( 阻止链接重定向页面。

$('.product-panel .add_to_cart_button').click(function(event) {
    event.preventDefault();
    $(this).children('i').remove();
    $(this).append('<i class="fa fa-check-circle-o added-ok"></i>');
    /* Act on the event */
});
相关文章：