修改示例以支持Opera
<!DOCTYPE html><html> ???<head> ???????<meta charset="utf-8" /> ???????<title></title> ???</head> ???<body> ???????<div> ???????????<button>Apples</button> ???????????<button>Cherries</button> ???????????<button>Bananas</button> ???????</div> ???????<div id="target"> ???????????press a button ???????</div> ???????<script type="text/javascript"> ???????????var buttons=document.getElementsByTagName("button") ???????????for(var i=0;i<buttons.length;i++){ ???????????????buttons[i].onclick=handleButtonPress; ???????????} ???????????var httpRequest; ???????????function handleButtonPress(e){ ???????????????httpRequest=new XMLHttpRequest(); ???????????????httpRequest.onreadystatechange=handleResponse; ???????????????httpRequest.open("GET",e.target.innerHTML+".html") ???????????????httpRequest.send() ???????????} ???????????function handleResponse(){ ???????????????if(httpRequest.readyState==4&&httpRequest.status==200){ ???????????????????document.getElementById("target").innerHTML=httpRequest.responseText; ???????????????} ???????????} ???????</script> ???</body></html>
第一个问题是Opera在触发readystatechange事件时不会生成一个Event对象。这就意味着必须把XMLHttpRequest对象指派给一个全局变量,这样才能在以后引用它。我定义一个名为的var,随后在handleButtonPress函数创建对象以及handleResponse函数处理已经完成的请求时调用了它。看上去可能不像是什么大问题,但如果用户在请求处理过程中按下按钮,全局变量就会被指派给一个新的XMLHttpRequest对象,你就无法再与原来那个请求交互了。
第二个问题是Opera没有在XMLHttpRequest对象上定义就绪状态常量,这就意味着你必须用之前表格中展示的数值来比对readyState属性的值。必须得检测4个值,而不是XMLHttpRequest.DONE。