jquery - ajaxStart 在 Google Chrome 中忽略 .show()

Question

我有一个 jQuery $.ajax 调用，它在所有主要浏览器中都能正常工作。

此外，我还使用 .ajaxStart 和 .ajaxStop 函数来制作 我的页面上有一个不可见的 div，上面写着“正在加载...”，可见。

问题是，虽然 ,ajaxStart 和 .ajaxStop 都会触发事件 没有任何问题(我从 console.log() 检查它)， .show 事件 ajaxStart 中的 jQuery 在 Google Chrome 中被完全忽略。

这是代码:

$("#loadMsg").ajaxStart(function(){
   console.log('ajaxstart');
   // the next command is ignored ONLY in Google Chrome
   $(this).show(0);
}); 

$.ajax({
  url:"xxx.php",
  type:"POST",
  data:"id="+id,
  async:false,
  success:function(data)
  {
     console.log(data); 
  }
});  

$("#loadMsg").ajaxStop(function(){
  console.log('ajaxfinish');
  $(this).hide(0);
});

我已经尝试过:

$("#loadMsg").show(0);  
$("#loadMsg").fadeIn();  
$("#loadMsg").css("display","block");  
$("#loadMsg").css("display","inline");  

等等

如有任何建议，我们将不胜感激。

Answer 1

您不能使用 async:false 来执行此操作，这将导致浏览器挂起，直到请求完成。我建议您考虑重新设计您的项目，使其异步工作，而不是尝试使用 async:false。