无法在WooCommerce中单击移动版本上的自定义后退按钮

Question

在Woocommerce中，我有一个自定义后退按钮，但是当我在移动版本中点击它时，它不起作用。

按钮链接到图像，但不链接到后面的功能。

这是我的代码：

add_action( 'woocommerce_before_single_product_summary', 'woocommerce_before_single_product_summary_button', 5);

function woocommerce_before_single_product_summary_button() {
     echo ' <button class="backbutton" type="button" onclick="history.back();"> Back </button> ';
}

它适用于桌面版，但不适用于移动版。

如何在移动和桌面版本上使其工作？

Answer 1

在你的钩子函数中，我用<button>替换了你的<a>，包括一个jQuery脚本，它将检测点击这个按钮的时间，并将触发一个应该在任何地方工作的类似事件history.go(-1);，包括移动触摸设备。

add_action( 'woocommerce_before_single_product_summary', 'woocommerce_before_single_product_summary_button', 5);
function woocommerce_before_single_product_summary_button() {
    echo ' <a href="#" class="back-button button"> '. __('Back').' </a> ';
    ?>
        <script>
            (function($) {
                $('a.back-button').click(function(e){
                    e.preventDefault();
                    history.go(-1);
                });
            })(jQuery);
        </script>
    <?php
}

此代码位于活动子主题（或活动主题）的function.php文件中。

这应该工作（在Android和Safari桌面上测试，但在iOS上测试）...