Question

我是jquery星球的新手，我不知道如何解决我的问题。我已经阅读了类似问题的所有答案，但它们都不适合我。我在MAC OS X上工作，因此使用JQuery 2.1.1进行Safari，但最终我的平台将在线共享，并且必须与其他浏览器兼容。

目的：我想显示一个包含我的加载动画的页面。但是我的JQuery函数包含一个带有async:false模式的ajax可执行文件，以便能够返回已执行脚本的响应。因此，我无法使用beforeSend和complete选项。我尝试使用我在post找到的解决方案。不幸的是我的动画没有显示

HTML：

<form id="myRun" method="post" action="" enctype="multipart/form-data">
    ... SOME ACTIONs ...
    <input class="demo" type="button" id="runner" value="Submit">
</form>
<div class="preloader" id="run_loader"><?php include('map/run_loader.php');?></div>

JS ：

// Run platform
$('#runner').click(function() {
  $('#run_loader').show();
  setTimeout(function() {
      var results = function(){
        $.ajax({
          url : "php/runner.php",
          type: "post",
          global: false,
          async:false,
          data : $("#myRun").serializeArray(),
          success: function (response) {
            //alert(response);
            //window.location.href = response; *** DOESN'T WORK HERE ***
            $('#run_loader').hide();
            res = response;
          }
        });
        return res;
      }();
  }, 0);
  window.location.href = String(results);
});

问题：你能帮我运行这个加载页面吗？您对我的代码有任何其他意见以改善自己吗？

提前致谢

Answer 1

您的问题完全是由使用async: false引起的。原因是因为这会阻止浏览器UI在请求进行时更新，从而导致用户相信浏览器已崩溃或挂起。因此，这是一种非常糟糕的做法，除非绝对没有其他选择，否则不应该使用它。如果您检查控制台，您甚至会看到浏览器警告您不要使用同步呼叫。

您的评论中window.location.href在success处理程序中不起作用的断言是错误的，它会正常工作。如果它不适合您，那么从服务器端代码返回到您需要调查和调试的AJAX调用时会出现错误。

要改进JS逻辑，您应该通过执行所有依赖于 success事件处理程序中的调用结果的逻辑来更有效地使用异步回调模式。您也不需要超时。试试这个：

$('#runner').click(function() { $('#run_loader').show(); $.ajax({ url: "php/runner.php", type: "post", data: $("#myRun").serializeArray(), success: function(response) { $('#run_loader').hide(); window.location.assign(response); } }); });

使用AJAX的JQuery加载器工作异步：false

1 个答案: