※ ChatGPTを利用し、要約された質問です(原文:Ajax データが取得できない)
Ajax データが取得できない
このQ&Aのポイント
【解決策あり】Ajaxを使ってデータを取得する際に、処理が中断される問題が発生しています。この記事では、その原因と解決策を解説します。
Ajaxを使ってデータを取得する際に、処理が中断されてしまう問題が発生しています。この記事では、データ取得の際によくあるエラーと対処法について詳しく解説します。
Ajaxでデータを取得する際に、「処理中です・・・」というメッセージが表示されたままで、データの取得ができないという問題が発生しています。この記事では、この問題の原因と解決策について詳しく説明します。
現在、AJAXを勉強中です。以下のhtmlを実行し、pref.jsを呼び出すコードをサイトから引用して記述しました。
しかし、「データを取得する」ボタンを押すと、【処理中です・・・】というメッセージが出るだけで、いっこうに該当データを取得できません。(本来であれば、指定されたxmlファイル内のデータが表示されるはずなのですが・・)
何が原因なのでしょうか。
解決策がわかる方がいらっしゃいましたらご教授ください。
よろしくお願いします。
■pref.html
---------------------------------
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<script type="text/javascript" src="../lib/prototype.js"></script>
<script type="text/javascript" src="pref.js"></script>
<link href="pref.css" rel="stylesheet" type="text/css">
<title>pref</title>
</head>
<body>
<div>
<input type="button" id="btnData" value="データ取得" />
<input type="button" id="btnClear" value="クリア" />
</div>
<div id="state"></div>
<div id="result"></div>
</body>
</html>
---------
■pref.js
----
onload = init;
var state;
var result;
function init() {
$("btnData").onclick = prefDisp;
$("btnClear").onclick = clearDisp;
state = $('state');
result = $('result');
}
function prefDisp() {
state.innerHTML = "処理中です・・・<br />\n";
var url = "http://ws.bzen.net/pgtop/pref.xml";
var paramList = "";
new Ajax.Request(url,
{
method: 'get',
onSuccess: getData,
onFailure: showErrMsg,
parameters: paramList
});
function getData(data){
var response = data.responseXML.getElementsByTagName('Response');
var item = response[0].getElementsByTagName('Item');
var tmpHtml="";
for(i = 0; i < item.length; i++){
var prefCd = item[i].getElementsByTagName('PREF_CD');
var prefCdValue = prefCd[0].firstChild.nodeValue;
var prefName = item[i].getElementsByTagName('PREF_NAME');
var prefNameValue = prefName[0].firstChild.nodeValue;
tmpHtml += prefCdValue + " " + prefNameValue + "<br />\n";
}
result.innerHTML = tmpHtml;
state.innerHTML = "データを取得しました。<br />\n";
}
function showErrMsg(){
clearDisp();
state.innerHTML = "データを取得できませんでした。<br />\n";
}
}
function clearDisp() {
state.innerHTML = "";
result.innerHTML = "";
}
---
お礼
ご回答ありがとうございます。 教えていただいた原因をもとに、最終的に中継ファイル?なるものをおくことで解決しました。 ありがとうございました。 ※過去の質問に関しては、未だうまくいっていないため、クローズしていない状況です。 早く解決できるといいのですが・・・。