1

首先，关于重写我的标题有什么建议吗？

问题：我有一个 AJAX 可更新 div，当我的错误检查alert调用进入时，一切正常。但是当我删除一个特定的，DIV 永远不会更新。我知道这听起来很混乱，但代码如下，然后我会进一步解释。

AJAX 脚本

var xmlhttp
    /*@cc_on @*/
    /*@if (@_jscript_version >= 5)
      try {
      xmlhttp=new ActiveXObject("Msxml2.XMLHTTP")
     } catch (e) {
      try {
        xmlhttp=new ActiveXObject("Microsoft.XMLHTTP")
      } catch (E) {
       xmlhttp=false
      }
     }
    @else
     xmlhttp=false
    @end @*/
    if (!xmlhttp && typeof XMLHttpRequest!='undefined') {
     try {
      xmlhttp = new XMLHttpRequest();
     } catch (e) {
      xmlhttp=false
     }
    }
    function myXMLHttpRequest() {
      var xmlhttplocal;
      try {
        xmlhttplocal= new ActiveXObject("Msxml2.XMLHTTP")
     } catch (e) {
      try {
        xmlhttplocal= new ActiveXObject("Microsoft.XMLHTTP")
      } catch (E) {
        xmlhttplocal=false;
      }
     }

    if (!xmlhttplocal && typeof XMLHttpRequest!='undefined') {
     try {
      var xmlhttplocal = new XMLHttpRequest();
     } catch (e) {
      var xmlhttplocal=false;
      alert('couldn\'t create xmlhttp object');
     }
    }
    return(xmlhttplocal);
}

function sndReq(page,key,includesDir,changeDiv,parameterString) {
    var divToChange = document.getElementById(changeDiv); // the Div that the data will be put into

    // Place loading image in container DIV
    divToChange.innerHTML = '<div class="loading">Loading</div>';

    if (includesDir == 1){
        //Find Current Working Directory.  Use to find path to call other files from
        var myloc = window.location.href;
        var locarray = myloc.split("/");
        delete locarray[(locarray.length-1)];
        var arraytext = locarray.join("/");

        xmlhttp.open("POST","AJAXCaller.php",true);
        xmlhttp.setRequestHeader("Content-type","application/x-www-form-urlencoded");
        xmlhttp.send(parameterString);

    } else {

    }

    xmlhttp.onreadystatechange = handleResponse(changeDiv);
    xmlhttp.send(null); 
}

function handleResponse(changeDiv) {
/* ======== If I remove the following line script halts ================*/
/* ======== If line stays here, script executes perfectly ==============*/
    alert('to changetext 1\n'+xmlhttp.responseText);
/* =========End of line removal issue =================================*/       
  if(xmlhttp.readyState == 4){

        if (xmlhttp.status == 200){

        var response = xmlhttp.responseText;

        var update = new Array();

            if(response.indexOf('|') != -1) {
                update = response.split('|');
                changeText(update[0], update[1]);
            } else {
                changeText(changeDiv, response);
            }

        } //End IF xmlhttp.status == 200


    }
}

function changeText( div2show, text ) {
    // Detect Browser
    var IE = (document.all) ? 1 : 0;
    var DOM = 0; 
    if (parseInt(navigator.appVersion) >=5) {DOM=1};

    // Grab the content from the requested "div" and show it in the "container"
    if (DOM) {
        var viewer = document.getElementById(div2show);
        viewer.innerHTML = text;
    }  else if(IE) {
        document.all[div2show].innerHTML = text;
    }
}

当我检查我的 firefox 错误控制台时，仅当我删除代码中定义的警报时才会出现此错误：

Timestamp: 5/30/2012 5:07:55 PM
Error: b.data is undefined
Source File: http://cdn.sstatic.net/js/wmd.js?v=cfd2b283af83
Line: 92

我是一名高级 PHP/mySQL 开发人员，但一直在努力掌握 AJAX/Javascript。疯狂地做教程。因此，请在评论/答案中进行描述，以便我可以将它们用作学习的参考...

为什么显示警告框会以任何方式改变代码执行（为了更好！）？

新错误 - Google Chrome 和 Firefox 控制台（叹息...）

Uncaught Error: INVALID_STATE_ERR: DOM Exception 11
sndReqAJAX.js:89
element.onclick

第 89 行如下（由 Google Chrome 控制台验证）

xmlhttp.send(null);

我在网上找到的所有内容都涉及关于不存在的 DOM 对象的极其复杂的问题……这不适用于这里，对吗？

4

1 回答 1

3

首先，问题。这是行：

xmlhttp.onreadystatechange = handleResponse(changeDiv);

这是错误的原因是它xmlhttp.onreadystatechange应该是一个函数 - 你需要为属性分配一个函数，你正在做的是调用函数并将返回值分配给属性。这本身不是问题，只要你的函数返回一个函数。它没有。

如果您习惯于使用 PHP（尤其是如果您习惯于使用 PHP <5.3），您可能不习惯这个概念。Javascript 以某种方式支持闭包，任何不经常使用它们的人都会感到困惑。

该行需要如下所示：

xmlhttp.onreadystatechange = handleResponse;

通过附加(changeDiv)，您正在调用该函数，而您需要做的只是传递它，就像您传递任何其他值一样。

现在，变得复杂的地方是您想要传递一个在调用函数范围内的本地参数。有很多方法可以处理这个问题，但是粗略地看一下你的代码告诉我它handleResponse()没有在其他任何地方使用，所以最好将它定义为一个闭包，而不是用一个命名的事件处理程序乱扔全局范围。这也克服了变量范围问题：

xmlhttp.onreadystatechange = function() {
  if (xmlhttp.readyState == 4) {
    if (xmlhttp.status == 200) {
      var response = xmlhttp.responseText;
      var update = []; // "new Array()" is baaaad
      if (response.indexOf('|') != -1) {
        update = response.split('|');
        changeText(update[0], update[1]);
      } else {
        changeText(changeDiv, response);
      }
    } //End IF xmlhttp.status == 200
  }
};

用该代码块替换上述有问题的行，并删除handleResponse()函数定义，这应该可以解决直接问题。现在，至于为什么alert()“修复”您的原始代码 - 这有点难以解释，但我会试一试......给我一分钟来正确检查代码

放弃了完整且易于理解的解释的尝试。如果有人想要一个，发表评论，我会在我睡一会后再做一次......

于 2012-05-30T23:38:52.667 回答