基于jquery实现省市联动特效


Posted in Javascript onDecember 17, 2015

本文实例讲述了基于jquery实现省市联动特效的代码,分享给大家供大家参考,具体如下:

运行效果图:

基于jquery实现省市联动特效

具体代码如下

<!DOCTYPE html>
<html lang="en">
<head>
 <meta charset="UTF-8">
 <title>Demo</title>
 <!-- 引入jquery -->
 <script src="http://lib.sinaapp.com/js/jquery/1.9.1/jquery-1.9.1.min.js" type="text/javascript"></script>
 <!-- 引入插件 -->
 <script src="jquery.area.js" type="text/javascript"></script>
 <script type="text/javascript">
  $(function () {
   $('#area').GangedArea({
    level: 2, // 显示级别, 最大是3, 最小是1
    url: "area.json",// area对应的路径
    provinceValue: "",// 默认指定省份id, 一般编辑的时候使用
    cityValue: "", //指定默认城市id, 一般编辑的时候使用
    districtValue: '', // 默认区id, 一般编辑的时候使用
    className: '', // 附加样式
    provinceName: 'province', // 省份name值
    cityName: 'city',//市name值
    districtName: 'district',// 区name值
    tip: '===请选择==='// 默认提示
   });
  })
 </script>
</head>
<body>
<div id="area"></div>
</body>
</html>

希望本文所述对大家JavaScript程序设计有所帮助。

Javascript 相关文章推荐
JS类的封装及实现代码
Dec 02 Javascript
网络图片延迟加载实现代码 超越jquery控件
Mar 27 Javascript
在Javascript中处理数组之toSource()方法的使用
Jun 09 Javascript
javascript验证邮件地址和MX记录的方法
Jun 16 Javascript
jquery实现点击变换导航样式的方法
Aug 31 Javascript
Angular中ng-repeat与ul li的多层嵌套重复问题
Jul 24 Javascript
微信小程序使用audio组件播放音乐功能示例【附源码下载】
Dec 08 Javascript
Webpack框架核心概念(知识点整理)
Dec 22 Javascript
Vuex入门到上手教程
Jun 20 Javascript
JavaScript 格式化数字、金额、千分位、保留几位小数、舍入舍去
Jul 23 Javascript
vue v-for 点击当前行,获取当前行数据及event当前事件对象的操作
Sep 10 Javascript
vue3使用vuedraggable实现拖拽功能
Apr 06 Vue.js
js实现网页收藏功能
Dec 17 #Javascript
详解javascript中原始数据类型Null和Undefined
Dec 17 #Javascript
JS实现合并两个数组并去除重复项只留一个的方法
Dec 17 #Javascript
JS数组合并push与concat区别分析
Dec 17 #Javascript
理解Javascript的call、apply
Dec 16 #Javascript
javascript实现网站加入收藏功能
Dec 16 #Javascript
javascript实现无缝上下滚动特效
Dec 16 #Javascript
You might like
php中利用explode函数分割字符串到数组
2014/02/08 PHP
php文件上传、下载和删除示例
2020/08/28 PHP
php连接微软MSSQL(sql server)完全攻略
2016/11/27 PHP
php用wangeditor3实现图片上传功能
2019/08/22 PHP
php libevent 功能与使用方法详解
2020/03/04 PHP
js中escape对应的C#解码函数 UrlDecode
2012/12/16 Javascript
jQuery点击自身以外地方关闭弹出层的简单实例
2013/12/24 Javascript
js判断undefined类型示例代码
2014/02/10 Javascript
JS和函数式语言的三特性
2014/03/05 Javascript
利用函数的惰性载入提高javascript代码执行效率
2014/05/05 Javascript
jquery mobile的触控点击事件会多次触发问题的解决方法
2014/05/08 Javascript
Bootstrap和Angularjs配合自制弹框的实例代码
2016/08/24 Javascript
Vue.js动态组件解析
2016/09/09 Javascript
实现隔行换色效果的两种方式【实用】
2016/11/27 Javascript
Javascript 高性能之递归,迭代,查表法详解及实例
2017/01/08 Javascript
全面解析vue中的数据双向绑定
2017/05/10 Javascript
vue2.0 better-scroll 实现移动端滑动的示例代码
2018/01/25 Javascript
jQuery实现网页拼图游戏
2020/04/22 jQuery
layer弹窗在键盘按回车将反复刷新的实现方法
2019/09/25 Javascript
node.js中Buffer缓冲器的原理与使用方法分析
2019/11/23 Javascript
编写一个javascript元循环求值器的方法
2020/04/14 Javascript
python计算方程式根的方法
2015/05/07 Python
深入讲解Python编程中的字符串
2015/10/14 Python
python实现二叉查找树实例代码
2018/02/08 Python
Python基于xlrd模块操作Excel的方法示例
2018/06/21 Python
Python使用ffmpy将amr格式的音频转化为mp3格式的例子
2019/08/08 Python
Python数据存储之 h5py详解
2019/12/26 Python
Python关于反射的实例代码分享
2020/02/20 Python
Python中Selenium库使用教程详解
2020/07/23 Python
python用tkinter实现一个简易能进行随机点名的界面
2020/09/27 Python
英国时尚服饰电商:Boohoo
2017/10/12 全球购物
德国购买踏板车网站:Microscooter
2019/10/14 全球购物
Prototype如何实现页面局部定时刷新
2013/08/06 面试题
计算机网络专业推荐信
2013/11/24 职场文书
电工工作职责范本
2014/02/22 职场文书
2016年过年放假安排通知
2015/08/18 职场文书