<html>
<head>
<title>Ajax Test</title>
<script language="javascript" type="text/javascript" src="ajax.js">
</script>
</head>
<body>
<h1>Ajax Quiz Example</h1>
<form>
<p><b>Question:</b>
<span id="question">...
</span>
</p>
<p><b>Answer:</b>
<input type="text" name="answer" id="answer">
<input type="button" value="Sumbit" id="submit">
</p>
<input type="button" value="Start the Quiz" id="startq">
</form>
<script language="javascript" type="text/javascript" src="quiz.js">
</script>
</body>
</html>
<?
xml version="1.0"?>
<questions>
<q>What DOM object contains URL information for the window?</q>
<a>location</a>
<q>Which method of the document object finds the object for an element?</q>
<a>getElementById</a>
<q>If you declare a variable outside a function,is it global or local?</q>
<a>global</a>
<q>What is the formal standard for the JavaScript language called?</q>
<a>ECMAScript</a>
</questions>
?>
var qn=0;
function getQuestions()
{
obj=document.getElementById("question");
obj.firstChild.nodeValue="(please wait)";
ajaxCallback=nextQuestion;
ajaxRequest("questions.xml");
}
function nextQuestion()
{
questions=ajaxreq.responseXML.getElementsByTagName("q");
obj=document.getElementById("question");
if(qn<questions.length)
{
q=questions[qn].firstChild.nodeValue;
obj.firstChild.nodeValue=q;
}
else
{
obj.firstChild.nodeValue="(no more questions)";
}
}
function checkAnswer()
{
answers=ajaxreq.responseXML.getElementsByTagName("a");
a=answers[qn].firstChild.nodeValue;
answerfield=document.getElementById("answer");
if(a==answerfield.value)
{
alert("Correct!");
}
else
{
alert("Incorrect.The correct answer is:"+a);
}
qn=qn+1;
answerfield.value="";
nextQuestion();
}
obj=document.getElementById("startq");
obj.onclick=getQuestions;
obj=document.getElementById("submit");
obj.onclick=checkAnswer;
var ajaxreq=false,ajaxCallback;
function ajaxRequest(filename)
{
try{
ajaxreq=new XMLHttpRequest();
}
catch(error)
{
try{
ajaxreq=new ActionXObject("Microsoft.XMLHTTP");
}
catch(error)
{
return false;
}
}
ajaxreq.open("GET",filename);
ajaxreq.onreadystatechange=ajaxResponse;
ajaxreq.send(null);
}
function ajaxResponse()
{
if(ajaxreq.readyState !=4)
return;
if(ajaxreq.status==200)
{
if(ajaxCallback)
ajaxCallback();
}
else alert("Request failed:"+ajaxreq.statusText);
return true;
}
你的代码只能在IE上运行,而且需要调试,最好直接用jquery,现在几乎没有人用这么底层的方式写程序了。
你发布网站了没有?没有的话if(ajaxreq.status==200)判断要改为 if(ajaxreq.status==200||0==ajaxreq.status),非http协议访问status成功是0,不是200
而且你的xml文件格式也是错误的。最后的?>要去掉,
<?
xml version="1.0"?>
要变为
<?xml version="1.0"?>
不知道是不是你贴出来时有问题还是什么
改正上面的错误发布网站应该就没问题了(如果你还是本地file访问,IE生成不了xmldom,firefox可以,而且你是先判断XMLHttpRequest对象先,ie非http协议也访问不了本地文件,和chrome一样)
参考:http://bbs.csdn.net/topics/310120750
1、看看ajax调用有没有错
2、nextQuestion方法中有没有写错的地方,qn这个变量会不会越界