基于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 相关文章推荐
基于jQuery的表格操作插件
Apr 22 Javascript
调用HttpHanlder的几种返回方式小结
Dec 20 Javascript
以JSON形式将JS中Array对象数组传至后台的方法
Jan 06 Javascript
jQuery实现带延迟的二级tab切换下拉列表效果
Sep 01 Javascript
JS+CSS实现电子商务网站导航模板效果代码
Sep 10 Javascript
Vue学习笔记进阶篇之多元素及多组件过渡
Jul 19 Javascript
vue项目优化之通过keep-alive数据缓存的方法
Dec 11 Javascript
vue通过点击事件读取音频文件的方法
May 30 Javascript
菊花转动的jquery加载动画效果
Aug 19 jQuery
微信小程序Getuserinfo解决方案图解
Aug 24 Javascript
vue cli3.0结合echarts3.0与地图的使用方法示例
Mar 26 Javascript
微信小程序实现的一键连接wifi功能示例
Apr 24 Javascript
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
推荐文章系统(一)
2006/10/09 PHP
PHP文本操作类
2006/11/25 PHP
php 常用字符串函数总结
2008/03/15 PHP
破解图片防盗链的代码(asp/php)测试通过
2010/07/02 PHP
php抓取页面与代码解析 推荐
2010/07/23 PHP
JavaScript面向对象编程
2008/03/02 Javascript
ExtJS 2.0实用简明教程 之ExtJS版的Hello
2009/04/29 Javascript
json2.js的初步学习与了解
2011/10/06 Javascript
jquery、js调用iframe父窗口与子窗口元素的方法整理
2014/07/31 Javascript
EasyUI实现第二层弹出框的方法
2015/03/01 Javascript
JS实现适合于后台使用的动画折叠菜单效果
2015/09/21 Javascript
js设置和获取自定义属性的方法
2016/10/20 Javascript
js 实现省市区三级联动菜单效果
2017/02/20 Javascript
jQuery判断邮箱格式对错实例代码讲解
2017/04/12 jQuery
微信小程序实现给循环列表添加点击样式实例
2017/04/26 Javascript
详解微信UnionID作用
2019/05/15 Javascript
js实现页面多个日期时间倒计时效果
2019/06/20 Javascript
js实现整体缩放页面适配移动端
2020/03/31 Javascript
VSCode Vue开发推荐插件和VSCode快捷键(小结)
2020/08/08 Javascript
Python函数式编程指南(四):生成器详解
2015/06/24 Python
python更改已存在excel文件的方法
2018/05/03 Python
scikit-learn线性回归,多元回归,多项式回归的实现
2019/08/29 Python
关于多元线性回归分析——Python&amp;SPSS
2020/02/24 Python
Python使用xpath实现图片爬取
2020/09/16 Python
CSS3教程(9):设置RGB颜色
2009/04/02 HTML / CSS
移动端HTML5实现文件上传功能【附代码】
2016/03/25 HTML / CSS
德国古洛迷亚百货官网:GALERIA Kaufhof
2017/06/20 全球购物
TCP/IP模型的分界线
2012/12/01 面试题
七一表彰活动方案
2014/01/18 职场文书
互联网创业计划书写作技巧攻略
2014/03/23 职场文书
机械电子工程专业自荐书
2014/06/10 职场文书
普通党员对照检查材料
2014/09/24 职场文书
初中生庆国庆演讲稿范文2014
2014/09/25 职场文书
公务员年度考核个人总结
2015/02/12 职场文书
综合测评个人总结
2015/03/03 职场文书
2016秋季校长开学典礼致辞
2015/11/26 职场文书