Jquery N级联动 json/xml

本文涉及的产品
RDS Agent(兼容OpenClaw),2核4GB
RDS MySQL DuckDB 分析主实例,基础系列 4核8GB
RDS DuckDB + QuickBI 企业套餐,8核32GB + QuickBI 专业版
简介:

1.能自动带出地址,区号,邮政编码

2.省市区三级联动xml/json

3.附带省市区,区号,邮政编码的MySQL

bug  bind失效

Java代码   收藏代码
  1. $("#"+currentSelect.id).unbind("change");  
  2. $("#"+currentSelect.id).live("change", function(){  

city.php

Java代码   收藏代码
  1. <?php  
  2. $connect = mysql_connect(HOST, USER, PW)or die('Could not connect to mysql server');  
  3. mysql_select_db(DB, $connect) or die('Could not select database.');  
  4. //设置查询编码,不设查询时易出现乱码  
  5. mysql_query('set names utf8;');  
  6. $sql = "select cityid,city from `cities`  where provinceid=" . $_POST['parentId'];  
  7. $result = mysql_query($sql) or die (mysql_error());  
  8.   
  9. $list = array();  
  10. if (mysql_num_rows($result) > 0) {  
  11.     while ($row = mysql_fetch_array($result)) {  
  12.         $list[] = array('value' => $row['cityid'], 'label' => $row['city']);  
  13.     }  
  14. }  
  15. //print_r($list);  
  16. echo JSON($list);  
  17. mysql_free_result($result);   

html

Java代码   收藏代码
  1. <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">  
  2. <html>  
  3. <head>  
  4.     <meta http-equiv="Content-Type" content="text/html; charset=utf-8">  
  5.   
  6.     <script type="text/javascript" src="jquery.js"></script>  
  7.     <script type="text/javascript" src="LinkedSelect.js"></script>  
  8.     <script type="text/javascript" charset="utf-8">  
  9.         var select = new LinkedSelect();  
  10.         // 调用selct的init()方法,注意,该方法的参数是一个数组,用[]括起来,每个select的定义用{}括起来,多个select定义之间以,分割  
  11.         select.init([  
  12.             {  
  13.                 id:"province",  
  14.                 url:"http://localhost/provinces.php",  
  15.                 nullable:false,  
  16.                 defaultValue:'230000' //selected  
  17.             },  
  18.             {  
  19.                 id:"city",  
  20.                 url:"http://localhost/city.php",  
  21.                 nullable:false  
  22.             }  
  23.         ]);  
  24.     </script>  
  25.     <select name="province" id="province">  
  26.     </select>  
  27.     <select name="city" id="city">  
  28.     </select>  
  29. </html>  
 
相关实践学习
每个IT人都想学的“Web应用上云经典架构”实战
本实验从Web应用上云这个最基本的、最普遍的需求出发,帮助IT从业者们通过“阿里云Web应用上云解决方案”,了解一个企业级Web应用上云的常见架构,了解如何构建一个高可用、可扩展的企业级应用架构。
MySQL数据库入门学习
本课程通过最流行的开源数据库MySQL带你了解数据库的世界。 &nbsp; 相关的阿里云产品:云数据库RDS MySQL 版 阿里云关系型数据库RDS(Relational Database Service)是一种稳定可靠、可弹性伸缩的在线数据库服务,提供容灾、备份、恢复、迁移等方面的全套解决方案,彻底解决数据库运维的烦恼。 了解产品详情:&nbsp;https://www.aliyun.com/product/rds/mysql&nbsp;
相关文章
|
XML 存储 JSON
Twaver-HTML5基础学习(19)数据容器(2)_数据序列化_XML、Json
本文介绍了Twaver HTML5中的数据序列化,包括XML和JSON格式的序列化与反序列化方法。文章通过示例代码展示了如何将DataBox中的数据序列化为XML和JSON字符串,以及如何从这些字符串中反序列化数据,重建DataBox中的对象。此外,还提到了用户自定义属性的序列化注册方法。
272 1
|
XML JSON 前端开发
【Web前端揭秘】XML与JSON:数据界的双雄对决,你的选择将如何改写Web世界的未来?
【8月更文挑战第26天】本文深入探讨了XML和JSON这两种广泛使用的数据交换格式在Web前端开发中的应用。XML采用自定义标签描述数据结构,适用于复杂层次数据的表示,而JSON则以键值对形式呈现数据,更为轻量且易解析。通过对两种格式的示例代码、结构特点及应用场景的分析,本文旨在帮助读者更好地理解它们的差异,并根据实际需求选择最合适的数据交换格式。
371 1
|
XML JSON 数据处理
C# 中的 XML 与 JSON 数据处理
在现代软件开发中,数据交换和存储需求日益增长,XML 和 JSON 成为最常用的数据格式。本文从 C# 角度出发,详细介绍如何处理这两种格式,并提供示例代码。对于 XML,我们介绍了读取、创建和写入 XML 文件的方法;对于 JSON,则展示了如何使用 Newtonsoft.Json 库进行数据解析和序列化。此外,文章还总结了常见问题及其解决方案,帮助开发者更好地应对实际项目中的挑战。
464 61
C# 中的 XML 与 JSON 数据处理
|
XML JSON 数据可视化
数据集学习笔记(二): 转换不同类型的数据集用于模型训练(XML、VOC、YOLO、COCO、JSON、PNG)
本文详细介绍了不同数据集格式之间的转换方法,包括YOLO、VOC、COCO、JSON、TXT和PNG等格式,以及如何可视化验证数据集。
5003 1
数据集学习笔记(二): 转换不同类型的数据集用于模型训练(XML、VOC、YOLO、COCO、JSON、PNG)
|
存储 JSON 前端开发
jQuery Get 请求参数转换为 JSON
【8月更文挑战第22天】
342 2
|
XML JSON Java
使用IDEA+Maven搭建整合一个Struts2+Spring4+Hibernate4项目,混合使用传统Xml与@注解,返回JSP视图或JSON数据,快来给你的SSH老项目翻新一下吧
本文介绍了如何使用IntelliJ IDEA和Maven搭建一个整合了Struts2、Spring4、Hibernate4的J2EE项目,并配置了项目目录结构、web.xml、welcome.jsp以及多个JSP页面,用于刷新和学习传统的SSH框架。
618 0
使用IDEA+Maven搭建整合一个Struts2+Spring4+Hibernate4项目,混合使用传统Xml与@注解,返回JSP视图或JSON数据,快来给你的SSH老项目翻新一下吧
|
XML JSON 前端开发
C#使用HttpClient四种请求数据格式:json、表单数据、文件上传、xml格式
C#使用HttpClient四种请求数据格式:json、表单数据、文件上传、xml格式
3369 0
|
Java Spring 容器
彻底改变你的编程人生!揭秘 Spring 框架依赖注入的神奇魔力,让你的代码瞬间焕然一新!
【8月更文挑战第31天】本文介绍 Spring 框架中的依赖注入(DI),一种降低代码耦合度的设计模式。通过 Spring 的 DI 容器,开发者可专注业务逻辑而非依赖管理。文中详细解释了 DI 的基本概念及其实现方式,如构造器注入、字段注入与 setter 方法注入,并提供示例说明如何在实际项目中应用这些技术。通过 Spring 的 @Configuration 和 @Bean 注解,可轻松定义与管理应用中的组件及其依赖关系,实现更简洁、易维护的代码结构。
403 0
|
JSON JavaScript 数据格式
html jquery from 表单提交 application/x-www-form-urlencoded 改成 json
html jquery from 表单提交 application/x-www-form-urlencoded 改成 json
222 0
|
JSON JavaScript 数据格式
Jquery 将 JSON 列表的 某个属性值,添加到数组中,并判断一个值,在不在数据中
Jquery 将 JSON 列表的 某个属性值,添加到数组中,并判断一个值,在不在数据中
257 0