<!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

[未解决]Ajax-读取并解析XML，动态生成select下拉列表框的更多相关文章

  1. angularjs小练习（分别通过ng-repeat和ng-option动态生成select下拉框）

    本次做一个简单的关于动态生成select的练习 在实现上有两种方式: 其一.通过ng-repeat来实现 其二.通过ng-option来实现 在页面效果上,两种实现的效果都一样 但是在数据选择的数据从 ...

  2. Python 解析 XML 文件生成 HTML

    XML文件result.xml,内容如下: <ccm> <metric> <complexity>1</complexity> <unit> ...

  3. jQuery动态生成<select>下拉框

    前一阵在项目里需要动态生成下拉框,找了一下用jQuery实现比较方便,这里整理一下. 下文所述方法只是本人在项目中遇到问题的解决方法,场景较为简单,也希望能帮助有需要的朋友 1.动态生成下拉框的两种方 ...

  4. Java解析XML与生成XML文件

    XML是eXtensible Markup Language(可扩展标记语言)的简写形式,它是一种元标记语言(meta-markup language),也就是说它没有一套能够适用于各个领域中所有用户 ...

  5. AJAX请求返回JSON数据动态生成html

    1:DeliveryPersonVO对象 package com.funcanteen.business.entity.delivery.vo; import java.util.List; impo ...

  6. 动态生成select框内容

    获取动态数据,显示在select选项中,当前select在jsp页面中 <select > <option>这里放选中或者当前的数据</option> <%f ...

  7. java 中解析xml的技术

    最初,XML 语言仅仅是意图用来作为 HTML 语言的替代品而出现的,但是随着该语言的不断发展和完善,人们越来越发现它所具有的优点:例如标记语言可扩展,严格的语法规定,可使用有意义的标记,内容存储和表 ...

  8. Java高级特性 第15节 解析XML文档(3) - JDOM和DOM4J技术

    一.JDOM解析 特征: 1.仅使用具体类,而不使用接口. 2.API大量使用了Collections类. Jdom由6个包构成: Element类表示XML文档的元素 org.jdom: 解析xml ...

  9. java dom4j解析xml用到的几个方法

    1． 读取并解析XML文档: SAXReader reader = new SAXReader(); Document document = reader.read(new File(fileName ...

随机推荐

  1. idea 配置多个jdk

      1.File -->Project Structure 2.SDKs-->点击+号-->JDK-->目录选择到jdk文件夹所在的位置 3.选择jdk所在路径 4.可以配置多 ...

  2. Eclipse 如何创建Web项目

      Eclipse 如何创建Web项目 CreateTime--2018年3月8日16:43:33 Author:Marydon 第一步: 右键-->New-->Dynamic Web P ...

  3. 【BIEE】导出数据报错

    使用BIEE导出数据的时候,发现个问题,导出过程中,报错如下: 问题解决: 找到文件opmn.xml,路径为:/Middleware/instances/instance1/config/OPMN/o ...

  4. python之函数用法bin()

    # -*- coding: utf-8 -*- #python 27 #xiaodeng #python之函数用法bin() #bin() #说明:一个整数转换为一个二进制字符串 ''' bin(.. ...

  5. mysql中char,varchar,text

    1.char char最大长度是255字符,注意是字符数和字符集没关系. 1)可以有默认值, 2)尾部有空格会被截断 3)不管汉字.英文,还是其他编码,都可以存255字符 2.varchar 1)va ...

  6. 【Linux】撷取命令cut

    什么是撷取命令啊?说穿了,就是将一段数据经过分析后,取出我们所想要的.或者是经由分析关键词,取得我们所想要的那一行! 不过,要注意的是,一般来说,撷取信息通常是针对『一行一行』来分析的,并不是整篇信息 ...

  7. python学习笔记011——内置函数__module__、__name__

    1 __module__描述 __module__ : 如果当前模块为顶层模块执行 则打印__main__ 如果当前模块为被调用模块的时候 打印当前模块的名称 2 __module__示例 def f ...

  8. Linux内核同步 - classic RCU的实现

    一.前言 无论你愿意或者不愿意,linux kernel的版本总是不断的向前推进,做为一个热衷于专研内核的工程师,最大的痛苦莫过于此:当你熟悉了一个版本的内核之后,内核已经推进到一个新的版本,你曾经熟 ...

  9. Dev BarManager使用方法

    作者:jiankunking 出处:http://blog.csdn.net/jiankunking 近期使用BarManager时候.发现一个问题就是在一開始把BarManager控件拖到窗口上的时 ...

  10. 基于KWIC 的keyword匹配算法(管道+过滤器模式下实现)

    以下是基于KWIC 的keyword匹配算法(管道+过滤器模式下实现) 关键部分的管道+过滤器 软件体系下的实现, 在非常多的keyword搜索平台都使用了这一 循环移位+排序输出的 keyword匹 ...