Question

为什么这段代码不起作用（调用handleRequest State Change函数时）？：

function ajaxRequest(){ 
 var xmlObj = new XMLHttpRequest();
 xmlObj.open("GET","1.php",true);
 xmlObj.onreadystatechange = handleRequestStateChange;
 xmlObj.send(null);
}

var handleRequestStateChange = function(){  
    if(xmlObj.readyState == 4 && xmlObj.status==200){
        alert("if loaded");
    }
}

但是这个是（没有调用handleRequest StateChange函数）：

function ajaxRequest(){

 var xmlObj = new XMLHttpRequest();
 xmlObj.open("GET","1.php",true);

 xmlObj.onreadystatechange = function(){
    if(xmlObj.readyState == 4 && xmlObj.status==200){
            alert("if loaded");
    }
 }
 xmlObj.send(null);}

Answer 1

在这种特殊情况下，问题仅在于变量的范围，在这种情况下，ajaxRequest可以“看到”handleRequestStateChange，但handleRequestStateChange无法“看到”{{ 1}}。在第二个示例中，匿名函数可以看到xmlObj，因为它是“内部”xmlObject。

一个好的起点是这个stackoverflow的答案。 https://stackoverflow.com/a/500459/1480215

例如，删除ajaxRequest实际上修复了第一个代码（不是那个好主意）。

var

以下代码也可以使用

function ajaxRequest(){ 
  xmlObj = new XMLHttpRequest(); //suddenly global scope
  xmlObj.open("GET","1.php",true);
  xmlObj.onreadystatechange = handleRequestStateChange;
  xmlObj.send(null);
}

var handleRequestStateChange = function(){  
  if(xmlObj.readyState == 4 && xmlObj.status==200){
    alert("if loaded");
  }
}

为了完整性，我还会在下面包含应该起作用的片段

function ajaxRequest(){ 
  var xmlObj = new XMLHttpRequest();
  var handleRequestStateChange = function(){  
    if(xmlObj.readyState == 4 && xmlObj.status==200){
      alert("if loaded");
    }
  }
  xmlObj.open("GET","1.php",true);
  xmlObj.onreadystatechange = handleRequestStateChange;
  xmlObj.send(null);
  //but not if var handleRequestStateChange is here
  //due to https://stackoverflow.com/a/336868/1480215
}

如果我们正在讨论严格的function ajaxRequest(){ var xmlObj = new XMLHttpRequest(); xmlObj.open("GET","fragments.htm",true); xmlObj.onreadystatechange = handleRequestStateChange; xmlObj.send(null); function handleRequestStateChange(){ //this will work instead of var funcName=function(){} if(xmlObj.readyState == 4 && xmlObj.status==200){ alert("if loaded"); } } }事件（或一般事件），那么也可以使用传递的事件参数。

xmlHttpRequest

继续前进，我认为使用像http://www.openjs.com/scripts/jx/这样的小型现有ajax代码段或库可能是个好主意。也许甚至jQuery也有RPC（包括function ajaxRequest(){ var xmlObj = new XMLHttpRequest(); xmlObj.open("GET","1.php",true); xmlObj.onreadystatechange = handleRequestStateChange; xmlObj.send(null); } var handleRequestStateChange=function(event){ //event handlers passes this, generally var xmlObj=event.target || event.srcElement //for compatibility //but just having XMLHttpRequest(), is not fully cross-platform anyway if(xmlObj.readyState == 4 && xmlObj.status==200){ alert("if loaded"); } }来包含来自其他域的脚本而没有COR）

ajax onreadystatechange函数没有被调用

1 个答案: