demo.jsp代码:
<%@ page language="java" import="java.util.*" pageEncoding="utf-8"%>
<html>
<head>
<title>jquery xml解析</title>
<script type="text/javascript"
src="/jQuery/jQuery/jquery-1.2.6.pack.js"></script>
<script type="text/javascript">
$(document).ready(
function(){
$.ajax( {
url : "xx.xml",
success : function(xml) {
$(xml).find("province").each(function() {
var t = $(this).attr("name");//this->
$("#DropProvince").append("<option>" + t + "</option>");
});
}
});
$("#DropProvince").change(
function() {
$("#sCity>option").remove();
var pname = $("#DropProvince").val();
$.ajax({
url:"xx.xml",
success : function(xml) {
$(xml).find(
"province[name='" + pname+ "']>city").each(
function() {
$("#sCity").append(
"<option>"+ $(this).text()+"</option>");});
}
});
});
});
</script>
</head>
<body>
<form id="form1">
<div>
<select id="DropProvince" style="width: 60px;">
<option>
请选择
</option>
</select>
<select id="sCity" style="width: 60px;">
</select>
</div>
</form>
</body>
</html>
xx.xml里面的代码:
<?xml version="1.0" encoding="utf-8" ?>
<provinces>
<province name="湖北">
<city>武汉</city>
<city>黄石</city>
<city>宜昌</city>
<city>天门</city>
</province>
<province name="湖南">
<city>邵阳</city>
<city>长沙</city>
<city>株洲</city>
</province>
<province name="广东">
<city>广州</city>
<city>深圳</city>
</province>
</provinces>
使用jQuery 解析xml文档.. 这例题非常实用.. 感谢网友提供的源代码.
分享到:
相关推荐
本资源主要关注的是利用jQuery实现的省市级联选择功能,这是一种常见于网页表单中的交互设计,用户可以依次选择省份、城市(以及县区),以精确指定一个地理位置。 首先,我们要理解什么是省市级联。在网页设计中,...
本项目“JQuery 省市级联无刷新操作”旨在实现一个无需页面刷新即可完成省市区选择的交互功能,对于初学者来说是很好的实践案例。 首先,这个项目的实现原理基于AJAX(异步JavaScript和XML),它允许前端与后台...
标题提到的"全国省市区,三级级联,无刷新,json数据源,省市级联例子"是一个专门针对这一需求的解决方案。 首先,我们要理解什么是“三级联动”。在地理信息中,通常分为省级、市级和区县级三个级别。三级联动是指...
这里,我们主要关注如何通过SSH(Struts、Spring、Hibernate)框架实现省市级联的功能,并结合Ajax和DWR进行异步数据交互。 **SSH整合** SSH是三个开源Java框架的组合,包括Struts作为MVC(模型-视图-控制器)框架...
1. **jQuery**: jQuery是一个广泛使用的JavaScript库,它简化了HTML文档遍历、事件处理、动画以及AJAX交互。在本示例中,jQuery被用来操作DOM元素,监听事件,以及发起Ajax请求。 2. **Ajax**: AJAX (Asynchronous ...
总结,这个"AJAX省级二级连动例子"是一个典型的前端与后端交互的应用场景,它展示了如何通过AJAX、JavaScript、XML以及JAVA技术实现动态下拉框的联动效果,为用户提供流畅的交互体验。理解并掌握这些技术,对于提升...
《jQuery手机省市区三级联动城市选择代码》是一个实用的JavaScript技术实现,主要应用于移动设备上的交互设计,使得用户在选择地址时能方便地从省级、市级到区级进行逐级选择。这个压缩包包含了实现这一功能的核心...
jQuery 是一个广泛使用的JavaScript库,它简化了DOM操作、事件处理和Ajax交互,同时也提供了丰富的插件来扩展功能。在这个场景中,我们将讨论如何使用jQuery实现级联下拉列表。 首先,我们需要理解`$().related`这...
在网页开发中,省市区三级联动是一个常见的需求,它允许用户在选择省份后,自动更新相关的城市和区县选项。这种交互方式提高了用户体验,减少了不必要的页面刷新。本示例将介绍如何利用jQuery和Ajax技术来实现这个...
首先,jQuery是一个轻量级、高性能的JavaScript库,它极大地简化了JavaScript的DOM操作、事件处理以及AJAX交互。jQuery的核心特性包括选择器(用于选取HTML元素)、遍历(遍历DOM树)和效果(动画效果)。在本例中,...
例如,“省市选择三级联动,Html+Jquery+XML+Ajax实现,web开发各种语言都通用.7z”表明有一个使用HTML、jQuery、XML和Ajax实现的通用的省市区三级联动的例子。而“asp.net无刷新联动.rar”则是一个基于ASP.NET实现的...
股票定时刷新是另一个使用Ajax的例子,它可以实现在后台定期查询股票信息并在页面上实时更新。这通常通过设置定时器触发Ajax请求,服务器端接收到请求后查询最新股票数据,然后返回给客户端。为了优化性能,可以采用...
然后,使用jQuery监听第一个下拉列表的改变事件,当用户选择省份时,通过AJAX调用PHP脚本获取相应的市级数据;同样的,当市被选择后,获取对应的区级数据。PHP脚本则根据传入的参数返回相应级别的数据。 总的来说,...
在本文中,我们将探讨如何使用jQuery和Ajax技术来实现省市区三级联动的效果,这是一种常见的前端交互功能,尤其在填写地址信息时非常实用。我们将分别介绍未封装和封装两种实现方式。 首先,我们要理解这个功能的...
在这个案例中,当用户在省或市级下拉框中选择一项时,会触发一个Ajax请求,这个请求会发送到JSP页面,请求处理完成后,服务器返回县的选项数据,前端再用JavaScript动态更新县的下拉框。 3. **SQL2008数据库**:SQL...
在这个三级联动的例子中,UpdatePanel将用于封装省市县的选择控件,每次用户选择一个级别的地区时,UpdatePanel会触发异步请求,更新下一级别的选项。 接下来,我们需要创建三个DropDownList控件,分别对应省、市、...
在这种模式下,用户选择一个省后,相应的市将自动加载,接着选择市后,区会进一步加载。这种动态加载数据的方式大大提升了用户体验,减少了不必要的页面刷新。 DWR(Direct Web Remoting)是Java web应用中的一个...
`jQuery city-picker` 是一个方便的插件,它可以帮助开发者快速实现省市区三级联动效果,即当用户在选择省份时,市和区会根据所选的省份自动更新。下面将详细介绍这个插件的工作原理和使用方法。 ### jQuery 插件...
在这个实例中,JavaScript库`jquery-1.11.3.min.js`被使用,jQuery是一个广泛使用的JavaScript库,简化了DOM操作、事件处理和Ajax交互。通过jQuery,开发者可以编写更简洁的代码来实现三级联动效果。 4. **jQuery...