Question

HTML代码段：

<div id="loadingDiv"><img src="images/loader.gif" id="loadingImage"></div>

也：

<input id="form1Submit" type="button" class="button" name="Submit" value="Search"/>

CSS：

#loadingDiv
{
    position:absolute;top:200px;
    z-index:101;
    display:none;
}

剧本：

$(document).ready(function(){
    $("#form1Submit").click(function(){
        $("#loadingDiv").show();
        $( "#form1" ).submit();
    })

目的是显示＆＃34; loading＆＃34;提交搜索表单时前景中的图形。我开始时经常＆＃34;提交＆＃34;按钮，但将其更改为通用按钮，并使用脚本将提交功能放在其上。

除了Mac上的Safari之外，每个浏览器的每个版本都有效。在Mac上，搜索在没有前景图形的情况下运行，然后我们继续查看结果。如果我按下BACK按钮，图形就会显示，就像显示一样，但页面URL在完成之前正在继续。我认为将提交函数放入jquery可以解决这个问题，但事实并非如此。我也尝试过.fadeIn（）而不是.show（）。

有一个我无法回复的非常类似的帖子，它提供了一个我已尝试但未成功的修复程序，在此处：jQuery doesn't run in Safari on form submit

我会喜欢任何想法。我很困惑。

Answer 1

这很有效，而且与“黑客”的情况略有不同。你提交给我的，Barmar：

   $("#form1Submit").click(function(){
   $("#loadingDiv").fadeIn();
    setTimeout(function(){   
    $( "#form1" ).submit(); 
},500);

}）

在做了更多阅读之后，我一直在寻找关于在调用新位置时Safari / Mac如何处理DOM的相同投诉。我不确定为什么你的代码对我不起作用。我目前没有足够的随意访问Mac来充分探索它。

Answer 2

这是一个黑客，但你可以试试：

$("form1submit").click(function(e) {
    e.preventDefault();
    $("#loadingDiv").show();
    setTimeout(function() {
        $("#form1").submit();
    }, 10);
});

如果您使用fadeIn，则可以在回调函数中执行提交：

$("form1submit").click(function(e) {
    e.preventDefault();
    $("#loadingDiv").fadeIn(function() {
        $("#form1").submit();
    });
});

Answer 3

我遇到了同样的问题并遇到了这个问题并想出了如何解决你的问题，以及我的问题。我使用了fadeIn方法，并在下面执行了以下代码，它对我有用：

$("form1submit").click(function(e) {
     e.preventDefault();
     $("#loadingDiv").fadeIn();
});

jquery show（）或fadeIn（）不能与Safari Mac上的提交表单一起使用

3 个答案: