<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>www.mldnjava.cn,MLDN高端Java培训</title>
<script language="javascript">
var xmlHttp ;
function createXMLHttp(){
if(window.ActiveXObject){
xmlHttp = new ActiveXObject("Microsoft.XMLHTTP") ;
} else {
xmlHttp = new XMLHttpRequest() ;
}
}
function getCity(){
createXMLHttp() ;
xmlHttp.open("POST","allarea.xml") ;
xmlHttp.onreadystatechange = getCityCallback ;
xmlHttp.send(null) ;
}
function getCityCallback(){
if(xmlHttp.readyState == 4){
if(xmlHttp.status == 200){
var allarea = xmlHttp.responseXML.getElementsByTagName("allarea")[0].childNodes ; // 取得全部的allarea下的节点
var select = document.getElementById("city") ;
select.length = 1 ; // 每次选择一个
select.options[0].selected = true ; // 第一个为选中的状态
for(var i=0;i<allarea.length;i++){
var area = allarea[i] ;
var option = document.createElement("option") ;
var id = area.getElementsByTagName("id")[0].firstChild.nodeValue ;
var title = area.getElementsByTagName("title")[0].firstChild.nodeValue;
option.setAttribute("value",id) ;
option.appendChild(document.createTextNode(title)) ;
select.appendChild(option) ;
}
}
}
}
</script>
</head>
<body onload="getCity()">
<form action="" method="post">
请选择喜欢的城市:
<select id="city">
<option value="0"> - 请选择城市 -</option>
</select>
</form>
</body>
</html>

但是有个问题,就是,如果我把其中的

function createXMLHttp

换成如下实现,就会出错:

        function createXMLHttp(){
if(window.XMLHttpRequest){
xmlHttp = new XMLHttpRequest() ;
} else {
xmlHttp = new ActiveXObject("Microsoft.XMLHTTP") ;
}
}

症状就是读取不了allarea.xml

<?xml version="1.0" encoding="UTF-8"?>
<allarea>
<area>
<id>1</id>
<title>北京</title>
</area>
<area>
<id>2</id>
<title>天津</title>
</area>
<area>
<id>3</id>
<title>南京</title>
</area>
</allarea>

到目前为止,我对Ajax的理解仍浮于表面,先把问题放在这里,到了合适的时机再来解决。

参考了这篇blog:http://www.cnblogs.com/fullhouse/archive/2012/01/17/2324849.html

最新文章

  1. 使用PowerShell修改操作系统“环境变量”
  2. C语言题目复习前7章重点程序
  3. 16083001(古墓丽影GPA)
  4. 玩转单元测试之DBUnit
  5. Asp.Net Web API VS Asp.Net MVC
  6. Dynamic Programming (DP) 问题总结
  7. logfile提示stale错误解决方法
  8. bzoj1492--斜率优化DP+cdq分治
  9. es6五种遍历对象属性的方法 - 表格整理
  10. Java - 9个处理异常的最佳准则
  11. 全方位解读及介绍windows网络安全及常见攻击方式
  12. git 拉取远程分支到本地
  13. RT-SA-2019-004 Cisco RV320 Unauthenticated Diagnostic DataRetrieval
  14. Webbench、ab命令:做压力测试的工具和性能的监控工具
  15. RESTEASY ,从学会使用到了解原理。
  16. java面试题:当一个对象被当作参数传递到一个方法后,此方法可改变这个对象的属性,并可返回变化后的结果,那么这里到底是值传递还是引用传递?
  17. opencv学习之路(9)、对比度亮度调整与通道分离
  18. Difference between nn.softmax &amp; softmax_cross_entropy_with_logits &amp; softmax_cross_entropy_with_logits_v2
  19. 【AI科技大本营】
  20. 蛮力法解决0_1背包问题新思路-——利用C语言位域类型

热门文章

  1. ehcache.xml的配置详解和示例
  2. 11个强大的 Visual Studio 调试技能
  3. 继承Spring AbstractRoutingDataSource实现路由切换
  4. 〖Linux〗使用gsoap搭建web server(C++)
  5. 【laravel5.4】git上clone项目到本地,配置和运行 项目报错:../vendor/aotuload.php不存在
  6. Mac环境 MySQL 和 MySQLWorkBench 破解版百度云下载
  7. 搭建前端vue环境,安装vue-cli遇到Please try running this command again as root/Administrator的解决方案
  8. 利用C#改写JAVA中的Base64.DecodeBase64以及Inflater解码
  9. 标头“Vary:Accept-Encoding”指定方法[转]
  10. 最简易的PHP Storm调试模式开启方式