我正在为woo Commerce网站创建一个新的自定义付款插件.我需要为信用卡和一些其他输入字段添加一些自定义验证.我需要将所有这些验证添加到单独的js文件中,并希望仅在成功通过javascript验证后才触发签出功能.

我可以使用wp_enqueue_scripts函数加载js,但是单击检出按钮后,我的js代码未执行.
我要的是在结帐时单击,首先需要执行我的代码,然后根据我的验证检查,继续进行结帐功能.

解决方法:

WooCommerce在订单上绑定一个事件,并使用AJAX提交表单(您可以在checkout.js中查看代码).

这是我的解决方案：

1.用您自己的按钮替换原始的提交按钮

在functions.php中

add_filter('woocommerce_order_button_html', function(){
    return '<button class="new_submit button">Place Order</button>';
});

单击新按钮时,它将不会直接提交订单.

2.在新按钮上绑定活动

 jQuery(document).on('click', '.new_submit', function(e){
      e.preventDefault();       
      if (do_the_validation()){
        jQuery( 'form.checkout' ).submit();
      } else {
        return false;
      }
 })

另外,我建议您进行服务器端验证

add_action('woocommerce_checkout_process', 'my_validation');
function my_validation() { 
    //If it's invalid, add an error.
    if (!do_validation()) {
       wc_add_notice( __( 'Something goes wrong!' ), 'error' );
    }

}