php - 在结帐时更改所有与 WooCommerce 消息相关的优惠券代码的位置

Question

我想更改结帐页面中所有与 WooCommerce 消息相关的优惠券代码的位置。

我已成功将优惠券代码表单从其原始位置（结帐页面顶部）移动到订单详细信息表（woocommerce_review_order_before_payment挂钩）之后。

但是现在优惠券代码消息放置没有意义，特别是对于移动用户，因此我想将所有与优惠券代码相关的消息移动到优惠券表格下方（在woocommerce_review_order_before_payment钩子上）。

但是，重要的是只有与优惠券代码相关的消息才会被移动，而不是所有的消息。

这是与优惠券代码相关的所有 WooCommerce 消息的列表：

信息	消息类型	什么时候
优惠码已申请！	woocommerce-error	当您尝试应用已应用于您的订单的优惠券代码时。
优惠券“优惠券代码”不存在！	woocommerce-error	当您尝试应用不存在的优惠券代码时。
请输入优惠券代码。	woocommerce-error	当您尝试应用一个空的优惠券字段时。
优惠券已被删除。	woocommerce-message	当您从订单中成功删除优惠券代码时。
优惠券代码申请成功。	woocommerce-message	当您成功将优惠券代码应用于您的订单时。

有人可以帮忙吗？

标签： phpwordpresswoocommerce

Answer 1

首先，正如@Pavel Vnukov 所说nested forms are not supported and are not part of the w3c standard.，您已经添加了preventDefaultso default action should not be taken。

我已经修复了对 @Pavel Vnukov 代码的一些代码更改，以根据您的需要工作。

试试下面的代码。

(function($){

    $('.woocommerce-form-coupon-toggle').remove();
    $(document).on("click", 'button[name="apply_coupon"]', function(event) {
        
        event.preventDefault();

        $form = $('form[name="checkout"]');
        $form.block({message:''});

        var data = {
            security:       wc_checkout_params.apply_coupon_nonce,
            coupon_code:    $( 'input[name="coupon_code"]' ).val()
        };

        $.ajax({
            type:       'POST',
            url:        wc_checkout_params.wc_ajax_url.toString().replace( '%%endpoint%%', 'apply_coupon' ),
            data:       data,
            success:    function( code ) {
                
                $( '.woocommerce-error, .woocommerce-message' ).remove();
                $form.removeClass( 'processing' ).unblock();

                if ( code ) {
                    $( 'button[name="apply_coupon"]' ).parent().after( code );
                    $( document.body ).trigger( 'update_checkout', { update_shipping_method: false } );
                }

            },
            dataType: 'html'
        });

    });

})(jQuery);

经过测试和工作