<body>
<h1>省市联动</h1>
<h3 id="h3"></h3>
<select name="province" id="p">
<option>===请选择省份===</option>
</select>
<select name="city" id="c">
<option>===请选择市===</option>
</select>
</body>
<script type="text/javascript" src="<c:url value='//ajax-lib/ajaxutils.js'/>"></script>
<script type="text/javascript">
window.onload = function(){
var xmlHttp = createXMLHttpRequest();
xmlHttp.open("GET","<c:url value='/ProvinceServlet'/>",true);
xmlHttp.send(null);
xmlHttp.onreadystatechange = function(){
if (xmlHttp.readyState == 4 && xmlHttp.status == 200) {
var text = xmlHttp.responseText;
var proArray = eval("("+text+")");
for(var i=0;i<proArray.length;i++){
var pro = proArray[i];
var option = document.createElement("option");
option.value = pro.pid;
var node = document.createTextNode(pro.name);
option.appendChild(node);
//document.write(option.text);
document.getElementById("p").appendChild(option);
}
}else {
document.write("!");
}
};
};
</script>
没有问题,直接模拟你的数据
<body>
<h1>省市联动</h1>
<h3 id="h3"></h3>
<select name="province" id="p">
<option>===请选择省份===</option>
</select>
<select name="city" id="c">
<option>===请选择市===</option>
</select>
</body>
<script type="text/javascript">
//window.onload = function () {
// var xmlHttp = createXMLHttpRequest();
// xmlHttp.open("GET", "<c:url value='/ProvinceServlet'/>", true);
// xmlHttp.send(null);
// xmlHttp.onreadystatechange = function () {
// if (xmlHttp.readyState == 4 && xmlHttp.status == 200) {
var text ='[{name:"name1",id:"id1"}]'// xmlHttp.responseText;
var proArray = eval("(" + text + ")");
for (var i = 0; i < proArray.length; i++) {
var pro = proArray[i];
var option = document.createElement("option");
option.value = pro.pid;
var node = document.createTextNode(pro.name);
option.appendChild(node);
//document.write(option.text);
document.getElementById("p").appendChild(option);
}
//} else {
// document.write("!");
// }
// };
//};
</script>
var proArray = eval("(" + text + ")");
这一行出错了吧,个人觉得应该这样将字符串转成对象。
var proArray = eval('var data='+ text);
以后就可以使用data这个变量来更新你的界面了。