在重定向到 Woocommerce 中的支付網關頁面之前打開彈出消息

Question

在將用戶重定向到我的支付網關頁面之前，我不想向他們顯示彈出消息（在我的例子中，我使用 PayU Latam）。 我在woocomerce > templates > checkout > payment.php文件中做了一些修改但沒有成功，因為雖然我實現了打開彈出窗口，但彈出窗口打開但 1 秒后重定向到 PayU 頁面。 我想找到在用戶關閉彈出窗口后將用戶重定向到付款頁面的方法。

有任何想法嗎？

Answer 1

您可以在 payment.php 中的“下訂單”按鈕上方為您的彈出框添加一個新鏈接。 然后使用 CSS 隱藏原來的 Place Order 按鈕，並使用 jQuery 在彈出消息中單擊“確認”按鈕時觸發它。

這是一個使用來自https://jquerymodal.com/的 jQuery Modal 作為彈出框的示例，因為您沒有提供任何可使用的代碼。 您可以根據已有的代碼調整它。

在彈出窗口中點擊 jQuery 觸發訂單按鈕：

<script>
jQuery(document).ready(function($){
    $( "a#close_and_confirm_checkout" ).click(function() {
        $( "button#place_order" ).click();
    });
});
</script>

HTML 用於新的“下訂單”按鈕、彈出消息和確認結帳的新按鈕：

<a href="#confirm_checkout" rel="modal:open">Place Order</a>

<div id="confirm_checkout" class="modal">
    <p>Your popup message</p>
    <a href="#" rel="modal:close" id="close_and_confirm_checkout">Confirm Order</a>
</div>

最后將原來的 WooCommerce 下訂單按鈕隱藏在您的 CSS 中，該按鈕將由彈出框中的新按鈕觸發：

#place_order { display:none; }

測試和工作。 您可以選擇是否在單擊新的“確認訂單”按鈕時關閉彈出框，我認為最好是在用戶未完成結帳表單中所有必填字段的情況下，但您始終可以進一步開發它以檢查那些字段，只有在必填字段為空時才關閉該框。