为什么单击事件在 MacOS Safari 上不起作用？

Question

我有这个 jQuery：

jQuery(document).ready(function($) {
    // When the page is loading show the #preloader element 
    $("#preloader").fadeOut("slow");
    $("#page-container").fadeIn("slow");
    // When an article with article grid is clicked, display the loader
    $("a").on("touchstart click", function() { 
        $("#preloader").fadeIn("slow"); 
        });
});

它应该如何工作：

1. 页面加载并立即显示#preloader 元素。页面一加载，#preloader 元素就会淡出，而#page-container 会淡入。

2. 然后，当您单击链接时，#preloader 元素会在浏览器加载下一页时淡入。返回第 1 步。

因此在页面加载之间存在无缝过渡。

这在 Firefox 和 Chrome 上效果很好。但在 Safari 和所有 iOS 浏览器上，第 2 步中的点击事件不起作用。 #preloader 元素在新页面加载之前不会淡入。

我尝试添加使#preloader 元素淡入的 preventDefault，但随后浏览器从未重定向到新页面。

有什么想法吗？

Answer 1

解决了这个问题。这是我最终使用的：

jQuery(document).ready(function($) {
    // When the page is loading show the #preloader element 
    $("#preloader").fadeOut("slow");
    $("#page-container").fadeIn("slow");
    // When an link is clicked, display the loader
    $("a").on("touchstart click", function() { 
        event.preventDefault();
        newLocation = this.href;
        $("#preloader").fadeIn("slow", newpage); 
    });
    function newpage() {
        window.location = newLocation;
    }
});