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を理解するために一生懸命努力しています。狂ったようにチュートリアルを行う。ですから、コメント/回答を説明してください。そうすれば、それらを学習の参考として使用できます...

アラートボックスを表示すると、コードの実行が(より良い方法で)変更されるのはなぜですか?

新しいエラー-GoogleChrome&Firefoxコンソール(ため息...)

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

89行目は次のとおりです(Google Chromeコンソールで確認済み)

xmlhttp.send(null);

私がWebで見つけたものはすべて、存在しない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 に答える