省市联动ajax代码

<script type="text/javascript">

function createXmlHttpRequest() {

try {

return new XMLHttpRequest();

} catch (e) {

try {

return new ActiveXObject("Msxml2.XMLHTTP");

} catch (e) {

return new ActiveXObject("Microsoft.XMLHTTP");

}

}

}

window.onload = function() {

/*

发送异步请求

*/

var xmlHttp = createXmlHttpRequest();

xmlHttp.open("GET", "<c:url value='/ProvinceServlet'/>", true);

xmlHttp.send(null);

xmlHttp.onreadystatechange = function() {

if (xmlHttp.readyState == 4) {

if (xmlHttp.status == 200)

var proArray = eval("(" + xmlHttp.responseText + ")");

for (var i = 0; i < proArray.length; i++) {

var pro = proArray[i];

var option = document.createElement("option");

option.value = pro.pid;//这里赋id为了好处理

var textNode = document.createTextNode(pro.pname);

option.appendChild(textNode);

document.getElementById("province").appendChild(option);

}

}

};

var province = document.getElementById("province");

province.onchange = function() {

var xmlHttp = createXmlHttpRequest();

xmlHttp.open("POST", "<c:url value='/CityServlet'/>", true);

xmlHttp.setRequestHeader("Content-Type",

"application/x-www-form-urlencoded ");

//关键是怎么知道这个this就是option呢，这个this到底指的是什么

xmlHttp.send("pid=" + this.value);

xmlHttp.onreadystatechange = function() {

if (xmlHttp.readyState == 4 && xmlHttp.status == 200) {

var c = document.getElementById("city");

var cOption = c.getElementsByTagName("option");

while (cOption.length > 1) {

c.removeChild(cOption[1]);

}

var cityPro = eval("(" + xmlHttp.responseText + ")");

for (var i = 0; i < cityPro.length; i++) {

var city = cityPro[i];

var option = document.createElement("option");

option.value = city.cid;

var textNode = document.createTextNode(city.cname);

option.appendChild(textNode);

c.appendChild(option);

}

}

};

};

};

</script>