Javascript AJAX-显示加载图像直到加载数据库查询

我已经为这个问题做了很多搜索，但是我找不到具体的答案

我正在使用下面的代码执行查询。处理查询需要1-6秒或更长时间。在等待结果时，我希望用户知道某些东西正在工作：

<script language="javascript">
function ajaxRequest(){
var activexmodes=["Msxml2.XMLHTTP", "Microsoft.XMLHTTP"] //activeX versions to check for in IE
if (window.ActiveXObject){ //Test for support for ActiveXObject in IE first (as XMLHttpRequest in IE7 is broken)
  for (var i=0; i<activexmodes.length; i++){
   try{
    return new ActiveXObject(activexmodes[i])
   }
   catch(e){
    //suppress error
   }
 }
}
 else if (window.XMLHttpRequest) // if Mozilla, Safari etc
  return new XMLHttpRequest()
 else
  return false
}
</script>


<script language="javascript">
function ajaxget(){
var mygetrequest=new ajaxRequest()
mygetrequest.onreadystatechange=function(){
 if (mygetrequest.readyState==4){
  if (mygetrequest.status==200 || window.location.href.indexOf("http")==-1){
   document.getElementById("result").innerHTML=mygetrequest.responseText
  }
 else{
  alert("An error has occured making the request")
   }
 }
}
var namevalue=encodeURIComponent(document.getElementById("name").value)
mygetrequest.open("GET", "findclosestcityresults.php?location="+namevalue, true)
mygetrequest.send(null)
}
</script>

函数ajaxRequest（）{
var activexmodes=[“Msxml2.XMLHTTP”，“Microsoft.XMLHTTP”]//要在IE中检查的activeX版本
if（window.ActiveXObject）{//首先测试IE中对ActiveXObject的支持（因为IE7中的XMLHttpRequest被破坏）
对于（var i=0；i我看不到显示加载图像的代码。我通常不像您那样从头开始编写ajax调用代码，因为很多js框架都支持这一点。ajax调用是异步调用的，因此只要您在OnReadyState中不显示图像，它就不会影响加载图像e、 应该没问题。只需在执行ajax调用之前或之后将其放在某个位置。
我看不到显示加载图像的代码。我通常不会像您那样从头开始编写ajax调用代码，因为很多js框架都支持这一点。ajax调用是异步调用的，因此不会影响加载image只要在onreadystatechange中不显示图像，就可以了。只需在执行ajax调用之前或之后将其放在某个位置即可。

<script language="javascript">
function ajaxRequest(){
var activexmodes=["Msxml2.XMLHTTP", "Microsoft.XMLHTTP"] //activeX versions to check for in IE
if (window.ActiveXObject){ //Test for support for ActiveXObject in IE first (as XMLHttpRequest in IE7 is broken)
  for (var i=0; i<activexmodes.length; i++){
    try{
      return new ActiveXObject(activexmodes[i])
  }
  catch(e){
    //suppress error
  }
  }
}
else if (window.XMLHttpRequest) // if Mozilla, Safari etc
return new XMLHttpRequest()
else
 return false
}
</script>


<script language="javascript">
function ajaxget(){
  var mygetrequest=new ajaxRequest()
  mygetrequest.onreadystatechange=function(){
  if (mygetrequest.readyState==4){
    if (mygetrequest.status==200 || window.location.href.indexOf("http")==-1){
      document.getElementById("result").innerHTML=mygetrequest.responseText
    }
    else{
      alert("An error has occured making the request")
    }
  }
}
var namevalue=encodeURIComponent(document.getElementById("name").value)
//new code here!
document.getElementById("result").innerHTML="<img src='path-to-ajax-loader-moving.gif' />";
mygetrequest.open("GET", "findclosestcityresults.php?location="+namevalue, true)
mygetrequest.send(null)
}
</script>

函数ajaxRequest（）{
var activexmodes=[“Msxml2.XMLHTTP”，“Microsoft.XMLHTTP”]//要在IE中检查的activeX版本
if（window.ActiveXObject）{//首先测试IE中对ActiveXObject的支持（因为IE7中的XMLHttpRequest被破坏）
对于（变量i=0；i

函数ajaxRequest（）{
var activexmodes=[“Msxml2.XMLHTTP”，“Microsoft.XMLHTTP”]//要在IE中检查的activeX版本
if（window.ActiveXObject）{//首先测试IE中对ActiveXObject的支持（因为IE7中的XMLHttpRequest被破坏）
对于（var i=0；i您将其标记为jQuery，因此：

$("#loading_animation").bind({
    ajaxStart: function() { $(this).show(); },
    ajaxStop: function() { $(this).hide(); }
});

您将其标记为jQuery，以便：

$("#loading_animation").bind({
    ajaxStart: function() { $(this).show(); },
    ajaxStop: function() { $(this).hide(); }
});

-阅读这个。你的问题的答案在第2步。打电话之前，只需输入显示图像的代码ajax@Dan谢谢你的提醒。我编辑了上面的代码，但我想我做得不对。-读一下。你的问题的答案在第2步。在打电话之前，只需输入显示图像的代码ajax@Dan谢谢你的提醒，我编辑了上面的代码，但我想我做得不对。