<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> 原文链接：https://www.f2er.com/ajax/163077.html