没有警告调用时AJAX div没有更新错误:b.data未定义

时间:2012-05-30 23:15:56

标签: php javascript ajax javascript-events ajax-request

首先,有关重写我的头衔的任何建议吗?

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

AJAX SCRIPT

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对象不存在的极其复杂的问题......这不适用于此,是吗?

1 个答案:

答案 0 :(得分:3)

首先,问题。这是一行:

xmlhttp.onreadystatechange = handleResponse(changeDiv);

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

如果您习惯使用PHP(特别是如果您曾经使用过PHP&lt; 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()“修复”你的原始代码 - 这有点难以解释,但我会去... 给我一分钟来正确检查代码


尝试放弃完整且易于理解的解释。如果有人想要一个,发表评论,当我有一些睡眠时,我会再接受一次......