php - Ajax 添加到购物车在 wordpress 5.6 中不起作用

Question

此代码应该在产品页面中将带有 ajax 的产品添加到 woocommerce 购物车中，当 wordpress 5.6 发布时一切正常，但是当 Jquery 库更新时，此代码在变体产品中不起作用。请帮助解决这个 Jquery 冲突。这个问题不是在简单的产品和简单的产品添加到购物车中很好。

<?php

/**
 * JS for AJAX Add to Cart handling
 */
function ace_product_page_ajax_add_to_cart_js() {
    global $post;
    if('product' == $post->post_type) {
    ?>
    <script type="text/javascript" charset="UTF-8">
        jQuery(function($) {

            $('form.cart').on('submit', function(e) {
                e.preventDefault();

                var form = $(this);
                form.block({ message: null, overlayCSS: { background: '#fff', opacity: 0.6 } });

                var formData = new FormData(form.context);
                formData.append('add-to-cart', form.find('[name=add-to-cart]').val() );

                // Ajax action.
                $.ajax({
                    url: wc_add_to_cart_params.wc_ajax_url.toString().replace( '%%endpoint%%', 'ace_add_to_cart' ),
                    data: formData,
                    type: 'POST',
                    processData: false,
                    contentType: false,
                    complete: function( response ) {
                        response = response.responseJSON;

                        if ( ! response ) {
                            return;
                        }

                        if ( response.error && response.product_url ) {
                            window.location = response.product_url;
                            return;
                        }

                        // Redirect to cart option
                        if ( wc_add_to_cart_params.cart_redirect_after_add === 'yes' ) {
                            window.location = wc_add_to_cart_params.cart_url;
                            return;
                        }

                        var $thisbutton = form.find('.single_add_to_cart_button'); //
//                      var $thisbutton = null; // uncomment this if you don't want the 'View cart' button

                        // Trigger event so themes can refresh other areas.
                        $( document.body ).trigger( 'added_to_cart', [ response.fragments, response.cart_hash, $thisbutton ] );

                        // Remove existing notices
                        $( 'form.cart .added_to_cart' ).remove();
                        $( '.woocommerce-error, .woocommerce-message, .woocommerce-info' ).remove();
                        // Add new notices
                        form.closest('.product').before(response.fragments.notices_html)

                        form.unblock();
                    }
                });
            });
        });
    </script><?php 
    }
}
add_action( 'wp_footer', 'ace_product_page_ajax_add_to_cart_js' );

/**
 * Add to cart handler.
 */
function ace_ajax_add_to_cart_handler() {
    WC_Form_Handler::add_to_cart_action();
    WC_AJAX::get_refreshed_fragments();
}
add_action( 'wc_ajax_ace_add_to_cart', 'ace_ajax_add_to_cart_handler' );
add_action( 'wc_ajax_nopriv_ace_add_to_cart', 'ace_ajax_add_to_cart_handler' );

// Remove WC Core add to cart handler to prevent double-add
remove_action( 'wp_loaded', array( 'WC_Form_Handler', 'add_to_cart_action' ), 20 );

/**
 * Add fragments for notices.
 */
function ace_ajax_add_to_cart_add_fragments( $fragments ) {
    $all_notices  = WC()->session->get( 'wc_notices', array() );
    $notice_types = apply_filters( 'woocommerce_notice_types', array( 'error', 'success', 'notice' ) );

    ob_start();
    foreach ( $notice_types as $notice_type ) {
        if ( wc_notice_count( $notice_type ) > 0 ) {
            wc_get_template( "notices/{$notice_type}.php", array(
                'notices' => array_filter( $all_notices[ $notice_type ] ),
            ) );
        }
    }
    $fragments['notices_html'] = ob_get_clean();

    wc_clear_notices();

    return $fragments;
}
add_filter( 'woocommerce_add_to_cart_fragments', 'ace_ajax_add_to_cart_add_fragments' );

标签： phpjqueryajaxwordpresswoocommerce

Answer 1

通过更改以下行解决了问题：

 var formData = new FormData(form.context);

至：

 var formData = new FormData(this);