XML卷之实战锦囊(4):选单连动
动机:
现在我们做个在IE里应用XML的一个小例子:解决双下拉选单的连动问题。大家最常见的可能就是选取省份后改变城市选项的例子了,那我们就来尝试着用XML来完成吧。
以前介绍的一些功能我是直接用XML+XSL文件来完成的,大家可能还不是很熟悉它的用法,所以我这次就用HMTL+XML来做,希望能够让大家更清楚的了解--“XML原来可以如此简单!”:)
材料:
XML卷之选单连动
有2个文件:Citys.xml 和 CitySelect.htm
作用:
选择省份后可以自动显示相对应的城市,这样方便用户,有效的提高数据互动,让自己的页面更加绚丽多彩。
效果:
浏览这里
代码:
Citys.xml <?xml version="1.0" encoding="gb2312"?> <China> <State id="1" name="江西"> <City>九江</City> <City>南昌</City> <City>庐山</City> <City>景德镇</City> </State> <State id="2" name="北京"> <City>北京西</City> <City>居庸关</City> <City>清华园</City> <City>周口店</City> </State> <State id="3" name="福建"> <City>福州</City> <City>厦门</City> <City>漳州</City> </State> <State id="4" name="甘肃"> <City>兰州</City> <City>洛门</City> <City>嘉峪关</City> </State> <State id="5" name="广东"> <City>广州</City> <City>深圳</City> <City>东莞</City> <City>石牌</City> </State> <State id="6" name="安徽"> <City>合肥</City> <City>黄山</City> <City>九龙岗</City> <City>马鞍山</City> </State> </China>
CitySelect.htm
自定义函数:ChooseState
(读取XML数据中的省的名称,并增加到SelState的下拉列表中)
function ChooseState() { var source; var sourceName = "Citys.xml"; var source = new ActiveXObject('Microsoft.XMLDOM'); //创建一个 MSXML解析器实例 source.async = false; source.load(sourceName); //装入XML文档 root = source.documentElement; //设置文档元素为根节点元素 sortField=root.selectNodes("//@name"); //搜索属性中含有name的所有节点 for(var i=0;i<sortField.length;++i) //增加省份名称到下拉列表 { var oOption = document.createElement('OPTION'); oOption.text = " "+sortField[i].text+" "; oOption.value = sortField[i].text; form1.SelState.options.add(oOption); } ChooseCity(); }
自定义函数:ChooseCity
(根据当前选定的省名来读取XML数据中的对应城市名称,并增加到SelCity 的下拉列表中)
function ChooseCity() { x=form1.SelState.selectedIndex; //读取省份下拉框的当前选项 y=form1.SelState.options[x].value; sortField=root.selectNodes("//State[@name='"+y+"']/City&q uot;); //搜索name属性值等于 参数y的State节点下的所有city节点 for(var i=form1.SelCity.options.length-1;i>=0;--i) //撤消原来的列表项 { form1.SelCity.options.remove(i) } for(var i=0;i<sortField.length;++i) //增加城市名称到下拉列表 { var oOption = document.createElement('OPTION'); oOption.text = " "+sortField[i].text+" "; oOption.value = sortField[i].text; form1.SelCity.options.add(oOption); } }
表单源码
<BODY onLoad="ChooseState()"> <FORM action="" method="post" id="form1" name="form1"> <SELECT name="SelState" id="SelState" onchange="ChooseCity()" > </SELECT> <SELECT name="SelCity" id="SelCity" > </SELECT> </FORM> </BODY>
后记:
刚开始学XML的时候,我也有着和大家一样的迷惑 --- “XML我是学了,可究竟这XML应该怎么用呢?”这个问题阻难了我很久,很久......
因为电子商务和软件开发是我的专长,于是我觉得还是从身边最熟悉的开始做起吧。所以我将网站建设中最常用到的一些功能以XML的方式来完成。 你也一样可以的!
以上就是XML卷之实战锦囊(4):选单连动的内容,更多相关内容请关注PHP中文网(www.php.cn)!

热AI工具

Undresser.AI Undress
人工智能驱动的应用程序,用于创建逼真的裸体照片

AI Clothes Remover
用于从照片中去除衣服的在线人工智能工具。

Undress AI Tool
免费脱衣服图片

Clothoff.io
AI脱衣机

AI Hentai Generator
免费生成ai无尽的。

热门文章

热工具

记事本++7.3.1
好用且免费的代码编辑器

SublimeText3汉化版
中文版,非常好用

禅工作室 13.0.1
功能强大的PHP集成开发环境

Dreamweaver CS6
视觉化网页开发工具

SublimeText3 Mac版
神级代码编辑软件(SublimeText3)

热门话题

XML文件可以用PPT打开吗?XML,即可扩展标记语言(ExtensibleMarkupLanguage),是一种被广泛应用于数据交换和数据存储的通用标记语言。与HTML相比,XML更加灵活,能够定义自己的标签和数据结构,使得数据的存储和交换更加方便和统一。而PPT,即PowerPoint,是微软公司开发的一种用于创建演示文稿的软件。它提供了图文并茂的方

使用Python实现XML数据的合并和去重XML(eXtensibleMarkupLanguage)是一种用于存储和传输数据的标记语言。在处理XML数据时,有时候我们需要将多个XML文件合并成一个,或者去除重复的数据。本文将介绍如何使用Python实现XML数据的合并和去重的方法,并给出相应的代码示例。一、XML数据合并当我们有多个XML文件,需要将其合

Python中的XML数据转换为CSV格式XML(ExtensibleMarkupLanguage)是一种可扩展标记语言,常用于数据的存储和传输。而CSV(CommaSeparatedValues)则是一种以逗号分隔的文本文件格式,常用于数据的导入和导出。在处理数据时,有时需要将XML数据转换为CSV格式以便于分析和处理。Python作为一种功能强大

使用Python实现XML数据的筛选和排序引言:XML是一种常用的数据交换格式,它以标签和属性的形式存储数据。在处理XML数据时,我们经常需要对数据进行筛选和排序。Python提供了许多有用的工具和库来处理XML数据,本文将介绍如何使用Python实现XML数据的筛选和排序。读取XML文件在开始之前,我们需要先读取XML文件。Python有许多XML处理库,

使用PHP将XML数据导入数据库引言:在开发中,我们经常需要将外部数据导入到数据库中进行进一步的处理和分析。而XML作为一种常用的数据交换格式,也经常被用来存储和传输结构化数据。本文将介绍如何使用PHP将XML数据导入数据库。步骤一:解析XML文件首先,我们需要解析XML文件,提取出需要的数据。PHP提供了几种解析XML的方式,其中最常用的是使用Simple

Python实现XML和JSON之间的转换导语:在日常的开发过程中,我们常常需要将数据在不同的格式之间进行转换。XML和JSON是常见的数据交换格式,在Python中,我们可以使用各种库来实现XML和JSON之间的相互转换。本文将介绍几种常用的方法,并附带代码示例。一、XML转JSON在Python中,我们可以使用xml.etree.ElementTree模

使用Python处理XML中的错误和异常XML是一种常用的数据格式,用于存储和表示结构化的数据。当我们使用Python处理XML时,有时可能会遇到一些错误和异常。在本篇文章中,我将介绍如何使用Python来处理XML中的错误和异常,并提供一些示例代码供参考。使用try-except语句捕获XML解析错误当我们使用Python解析XML时,有时候可能会遇到一些

Python解析XML中的特殊字符和转义序列XML(eXtensibleMarkupLanguage)是一种常用的数据交换格式,用于在不同系统之间传输和存储数据。在处理XML文件时,经常会遇到包含特殊字符和转义序列的情况,这可能会导致解析错误或者误解数据。因此,在使用Python解析XML文件时,我们需要了解如何处理这些特殊字符和转义序列。一、特殊字符和
