html添加省市县联动下拉框,JSON+JS实现省市县三级联动下拉框

之前开发项目中，需求涉及到省市县的三级联动下拉框，但是网上的方法多数以XML+JS的方法，但是该方法可能会存在浏览器兼容问题，虽然有这个方面的解决方法，但我试过，效果不是很好，于是我找了一个JSON的实现方法，并进行了修改

1、json数据，存放了全国省市县三级的数据。如下为部分数据

2、Area.js，关键的JS代码

3、页面代码(JSP、HTML)

三级地市联动菜单

$(document).ready(function() {

Area.init('area.json');

var area = new Area('#areaContainer');

area.select([ '请选择', '请选择' ]);

$('#getValueBtn').click(function() {

alert(area.getAddress());

});

body {

font-size: 14px;

font-family: simsun;

margin: 0;

}

html添加省市县联动下拉框,JSON+JS实现省市县三级联动下拉框相关推荐

js原生，省市区三级联动插件
js原生,省市区三级联动插件 <%@ page language="java" contentType="text/html; charset=UTF-8" ...
动态二级下拉菜单html,js实现简洁大方的二级下拉菜单效果代码
本文实例讲述了js实现简洁大方的二级下拉菜单效果代码.分享给大家供大家参考.具体如下: 这是一款简洁大方的二级下拉菜单,菜单的颜色自己根据需要重新定义吧,这里仅给大家提供一种制作二级菜单的思路,整体效 ...
省市县联动列表html代码,html+js 全国省市县三级联动
[实例简介] [实例截图] [核心代码] 全国各省市js三级联动 body{ background:#EEEEEE;margin:0; padding:0; font-family:"微软雅 ...
实验有效的js原生前端全国三级联动
这是我的目录平级注意要在一个级别记录的笔记,当初记录在word文档侵权就删哈第二个亲测有用的三级联动 intextHtml.html <!doctype html> <h ...
html地区选择js,JavaScript实现省市区三级联动
JavaScript实现省市区三级联动之前的文章中我们说到过如何利用JavaScript实现二级联动,这次我们来说说如何利用JavaScript实现三级联动.效果如图: HTML代码:请选择省份:请 ...
php省城联动_使用php ajax实现一个省市区的三级联动
要求:写一个省市区(或者年月日)的三级联动,实现地区或时间的下拉选择. 实现技术:php ajax 实现:省级下拉变化时市下拉区下拉跟着变化,市级下拉变化时区下拉跟着变化. 使用chinastates ...
js之省市区(县)三级联动效果
省市区(县)三级联动效果,是我们软件开发比较常用的,特别是对一些crm,erp之类,当然也包括其他的后台管理系统,基本都涉及到,今天贴出这个常用的,方便个人复用和大家使用 <!DOCTYPE h ...
java封装省市区三级json格式,2016中国省市区三级联动json格式.pdf
2016中国省市区三级联动json格式 2016 年中国省市区三级联的JSON 格式 {"北京市":{"name":"北京市"," ...
PHP三级联动视频教程,PHP教程：thinkPHP实现的省市区三级联动功能示例
<PHP教程:thinkPHP实现的省市区三级联动功能示例>要点: 本文介绍了PHP教程:thinkPHP实现的省市区三级联动功能示例,希望对您有用.如果有疑问,可以联系我们. 本文实例讲 ...
Js做的城市三级联动,原创
说实话这方面的文章在网上很多,不过我下载了几个看了一下代码,发现都是出自一个人的手笔,而且那个联动很不好用,所以呢我就按照自己的想法再次写了一下这东西,分享给大家!欢迎转载但请注明出处Email:Se ...

html添加省市县联动下拉框,JSON+JS实现省市县三级联动下拉框

html添加省市县联动下拉框,JSON+JS实现省市县三级联动下拉框相关推荐

最新文章

热门文章