Question

我遇到了在Safari中无法运行的异步Ajax调用的问题。它适用于所有其他浏览器，但不适用于Safari。当我们在按钮或锚点上有一个重定向/链接被点击以调用Ajax函数时，这只是一个问题。

我在下面创建了一个非常简单的例子：

<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>Ajax issue is Safari</title>
<script src="//code.jquery.com/jquery-2.2.3.js"></script>
<script>
 $( document ).ready(function() {
    $('#mybutton').click(function(){
        $.ajax({
            type: "POST",
            dataType: "text",
            async: true,
            url: "dosomething.php",
            error: function(a,b,c){
                alert("Ajax Error");
            },
            success: function(data){
                alert(data);
            },
        });
    });
}); 
</script>
</head>
<body>
<a href="page2.php" id="mybutton">Click here</a>
</body>
</html>

dosomething.php在哪里

<?php 

echo "Success. Click ok to be redirected.";

?>

此示例的实时版本位于：http://visionfactor.com.au/ajax-safari/

虽然有一个href = Ajax总会吐出一个错误。一旦我删除href它将工作。如果我使用按钮而不是锚点并使用Javascript重定向，也是如此。同样的结果是重定向到位。

现在我意识到我可以将重定向放在Ajax成功回调中，但是我不想这样做，因为它似乎没有必要，因为它应该像其他所有浏览器一样在Safari中以其他方式工作。另外在我的真实世界（非简化）代码中执行此操作非常混乱，因为我有多个链接/按钮的相同类，因此它们都执行相同的Ajax但随后每个重定向到不同的位置。那么我将不得不通过其他一些值，例如另一个类，以便定义特定于该链接的相关重定向...就像我说的那样凌乱。

如何在Safari中使这个非常简单的代码工作？

谢谢，尼科尔

Answer 1

尝试像这样添加preventDefault：

$( document ).ready(function() {
    $('#mybutton').click(function (event) {

        event.preventDefault(); // stop the click to redirect to the URL in href

        $.ajax({
            type: "POST",
            dataType: "text",
            async: true,
            url: "dosomething.php",
            error: function(a,b,c){
                alert("Ajax Error");
            },
            success: function(data){
                alert(data);
            },
        });
    });
});

异步Ajax无法在Safari中使用重定向

1 个答案: