点击继续付款按钮后如何在结帐页面显示消息？

Question

我正在使用 Woocommerce。单击“继续付款”按钮后，我必须在结帐页面上显示一条消息。

到目前为止，我正在获取预加载器。如何显示“您正在支付网关上重定向”之类的消息。

我正在使用 WooCommerce 更改加载微调图标 Ajax 预加载器的应答代码。我刚刚将背景图片网址更改为：

background-image:url('https://i.sstatic.net/sEKwt.gif') !important;

点击继续付款后显示消息的代码如下：

add_action( 'woocommerce_checkout_order_processed', 'order_processed_with_pending_status', 10, 3 );
function order_processed_with_pending_status( $order_id, $posted_data, $order ) {
     echo"You are redirecting on payment gateway";
}

你能帮我找到正确的钩子吗？

Answer 1

我也遇到了同样的问题，加载程序不是特别明显，如果网关响应时间太长，一些客户会重新加载页面。

我希望在单击“处理付款”按钮后显示文本，并保留在那里，直到付款过程完成。我通过在循环中添加一系列消息使其变得更奇特，这些消息与实际发生的事情无关，但确实解释了需要时间处理的内容，其计时方式通常只显示一次。这是代码，希望有帮助：

    add_action('wp_footer', function () {
    ?>
    <style>
        #payment-processing {
            position: fixed;
            top: 50%;
            left: 50%;
            transform: translate(-50%, -50%);
            background-color: white;
            padding: 20px;
            border-radius: 10px;
            z-index: 9999;
            font-size: 20px; 
            margin: 80px; 
            box-shadow: 0 0 10px rgba(0, 0, 0, 0.1); 
            text-align: center; 
        }
    </style>
    <script>
        jQuery(document).ready(function($) {
            $('#place_order').click(function() {
                $('body').append('<div id="payment-processing"><b>PLEASE WAIT</b><br>Processing your payment ...</div>');
                
                var messages = [
                    "<b>PLEASE WAIT</b><br>Processing your payment ...",
                    "<b>PLEASE WAIT</b><br>Contacting card provider ...",
                    "<b>PLEASE WAIT</b><br>Preparing emails ...",
                    "<b>PLEASE WAIT</b><br>Preparing TXT messages ..."
                ];

                var currentMessageIndex = 0;

                function updateMessage() {
                    currentMessageIndex = (currentMessageIndex + 1) % messages.length;
                    $('#payment-processing').html(messages[currentMessageIndex]);
                }

                // Change message every 3 seconds
                setInterval(updateMessage, 3000);
            });
        });
    </script>
    <?php
 });