在woocommerce结帐页面上的“下订单”按钮上添加自定义脚本

Question

我试图将此脚本添加到woocommerce结帐页面的“下订单”按钮上：

$('#place_order').addClass('disabled');

但是，如果我将其放入footer.php文件中，它将无法正常工作。

我找到了一个资源，建议我重写woocommerce checkout.js文件，在/my-theme/woocommerce文件夹内进行克隆，但现在我不知道在哪里放置自定义脚本才能使其正常工作。

谢谢

Answer 1

您的脚本必须放置在ready处理程序中，但是在每个ready事件上（每当DOM完全加载时）仍然存在一个问题，woocommerce通过Ajax更新了Order Review部分，因此此操作将从Place Order删除您disabled类按钮。

您可以使用自定义事件updated_checkout ，该事件将在每个“ Update Order Review ajax操作结束时触发。

做这样的事情。

function add_checkout_script() { ?>

    <script type="text/javascript">

        jQuery(document).on( "updated_checkout", function(){
                $('#place_order').addClass('disabled');
            });         

    </script>

<?php       
}
add_action( 'woocommerce_after_checkout_form', 'add_checkout_script' );