2

AJAX の例を機能させようとしていますが、機能させることができません。XAMPPで問題なく実行できますか?

message.txt、index.html、ajaxtest.js の 3 つのファイルがあります。ハイパーリンクをクリックすると、message.txt の内容を含むポップアップが表示されます。(すべてのファイルは同じディレクトリにあります)

index.html

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">

<html>
  <head>
  <title> Using XMLHttpRequest</title>
  <script type="text/javascript" src="ajaxtest.js"></script>
  </head>
  <body>
    <p>
      <a href="message.txt" onclick="grabFile(this.href); return false;">
Click here
</a>
</p>
</body>
</html>

ajaxtest.js

function getHTTPObject() {
  var xhr = false;
  if (window.XMLHttpRequest) {  //see if a XMLHttpRequest exists
    xhr = new XMLHttpRequest();  //if it exists change "xhr" to a new instance of the object
  }
  else if (window.ActiveXObject) {  //see if ActiveX exists (for IE)
    try {  //Allows newer versions of IE to use the newer ActiveX object
      xhr = new ActiveXObject("Msxml2.AMLHTTP");  //if it exists change "xhr" to a new instance of the object
    }
    catch(e) { //catches an error and resets "xhr" to false
      try {  //Allows older versions of IE to fall back onto the older version using "try...catch"
        xhr = new ActiveXObject("Microsoft.XMLHTTP");  //if it exists change "xhr" to a new instance of the object
      }
      catch(e) {
        xhr = false;
      }
    }
  }
  return xhr;
}

function grabFile(file) {
  var request = getHTTPObject();
  if (request) {
    request.onreadystatechange = function() {
      displayResponse(request);
    };
    request.open("GET", file, true);
    request.send(null);
  }
}

function displayResponse(request) {
  if (request.readyState == 4) {
    if (request.status == 200 || request.status == 304) {
      alert(request.responseText);
    }
  }
}
4

2 に答える 2

4

セキュリティ上の理由から、クライアントのファイル システムへの JavaScript のアクセスは制限されています。ここでもっと読むことができます

Google Chrome を使用している場合は、次の-allow-file-access-from-filesコマンドで実行可能ファイルを起動する必要があります。

chrome.exe -allow-file-access-from-files

FireFoxにも同様の構成があるかもしれません

更新: コードを確認すると、 (200) および(304) ヘッダーと比較request.statusしていることがわかります。これらは Web サーバーから返される HTTP 応答ヘッダーであるため、Web サーバーでコードを実行する場合は応答ヘッダーを確認する必要があります。そうしないと、プロトコルを使用してローカルで実行すると、常に応答ヘッダーとして取得されます。OKNot Modifiedfile:///0

回避策は次のとおりです。ドメインを確認できます。ローカルで実行している場合は、応答ステータスを確認する必要はありません。

function displayResponse(request) {
  if (request.readyState == 4) {
    if (!document.domain || request.status == 200 || request.status == 304) {
      alert(request.responseText);
    }
  }
}
于 2012-05-17T10:56:20.283 に答える
0

私があなたの例で試したように、あなたのリクエストオブジェクトは状態4に達しておらず、再び使用しています。以下のコードの前に request.status を確認してください。常に 0 の値が取得されます。それが、スクリプトが警告応答を行わない理由です。

if (request.status == 200 || request.status == 304) {
  alert(request.responseText);
}

ソリューションについては、これを確認してください: http://www.ibm.com/developerworks/web/library/wa-ajaxintro3/

その助けを願っています。

于 2012-05-17T11:23:26.110 に答える