习课省市区的三级联动(cxselect的使用)
1,api:
http://www.jq22.com/jquery-info3238
2,demo:
http://blog.csdn.net/luo201227/article/details/38844175
3,自己写的:
jsp页面:
<!-- 引入js -->
<script type='text/javascript' src='${ctx}/js/core/jquery-1.7.2.min.js'></script>
<script src="${ctx }/js/com/jquery.cxselect.js"></script>
<script type="text/javascript">
$(function () {
//插件初始化地址 数据源地址
$.cxSelect.defaults.url = '${ctx }/js/com/cityData.min.json';
// 设置默认值及选项标题
$('#schoolarea').cxSelect({
selects: ['province', 'city', 'area'],
emptyStyle: 'none'
});
$('#educationarea').cxSelect({
selects: ['province2', 'city2', 'area2'],
emptyStyle: 'none'
});
}); </script> <ul class="back_rigth_inquire"> <li class="content_top margin_t_20">
<%--<div class="name_standard">--%>
<%--<span class="left_word">所在学校<i></i></span>--%>
<%--<select id="province" name="province3" class="province" data-value="" onchange="getschoollist();"></select>--%>
<%--<select id="city" name="city3" class="city" data-value="" onchange="getschoollist();"></select>--%>
<%--<select id="area" name="area3" class="area" data-value="" onchange="getschoollist();"></select>--%>
<%--<select id="schoolCode" name="scode" onchange="getsemesterlist()"><option value="">请选择学校</option></select>--%>
<%--</div>--%>
<div id="schoolarea">
<span class="left_word">所在学校 <i></i></span>
<select id="province" name="province3" class="province" data-value="" onchange="getschoollist();"></select>
<select id="city" name="city3" class="city" data-value="" onchange="getschoollist();"></select>
<select id="area" name="area3" class="area" data-value="" onchange="getschoollist();"></select>
<select id="schoolCode" name="scode" onchange="getsemesterlist()"><option value="">请选择学校</option></select>
</div>
</li>
<li>
<div id="educationarea">
<span class="left_word">所在教育局<i></i></span>
<select id="province2" name="province3" class="province2" data-value="" onchange="getEducationBureaulist();"></select>
<select id="city2" name="city3" class="city2" data-value="" onchange="getEducationBureaulist();"></select>
<select id="area2" name="area3" class="area2" data-value="" onchange="getEducationBureaulist();"></select>
<select id="code" name="scode" onchange="getsemesterlist()"><option value="">请选择教育局</option></select>
</div>
</li>
<br>
<%--<li class="content_top margin_t_20">--%>
<%--<div class="name_standard">--%>
<%--<span class="left_word">所在教育局<i></i></span>--%>
<%--<select id="province2" name="province3" class="province" data-value="" onchange="getEducationBureaulist();"></select>--%>
<%--<select id="city2" name="city3" class="city" data-value="" onchange="getEducationBureaulist();"></select>--%>
<%--<select id="area2" name="area3" class="area" data-value="" onchange="getEducationBureaulist();"></select>--%>
<%--<select id="code" name="scode" onchange="getsemesterlist()"><option value="">请选择教育局</option></select>--%>
<%--</div>--%>
<%--</li>--%> <p class="back_rigth_inquire_button">
<a class="button_query_view" onclick="queryBySchoolCode()">查询</a>
<a class="button_query_reset" onclick="resetSchoolCode()">重置</a>
</p>
</ul>
json数据 (cityData.min.json):
习课省市区的三级联动(cxselect的使用)的更多相关文章
- 省市区(县)三级联动代码(js 数据源)
ylbtech-JavaScript-Utility:省市区(县)三级联动代码(js 数据源) 省市区(县)三级联动代码(js 数据源) 1.A,源代码(Source Code)返回顶部 1.A.1, ...
- js之省市区(县)三级联动效果
省市区(县)三级联动效果,是我们软件开发比较常用的,特别是对一些crm,erp之类,当然也包括其他的后台管理系统,基本都涉及到,今天贴出这个常用的,方便个人复用和大家使用 <!DOCTYPE h ...
- 中国省市区地址三级联动jQuery插件 案例下载
中国省市区地址三级联动jQuery插件 案例下载 distpicker 是一款可以实现中国省市区地址三级联动jQuery插件.它使用简单,简单设置即可完成中国省市区地址联动效果. 安装 可以通过npm ...
- JQuery实现省市区的三级联动
JQuery实现省市区的三级联动 <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "h ...
- JavaScript实现省市区的三级联动
JavaScript实现省市区的三级联动 <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" &qu ...
- 中国省市区地址三级联动插件---jQuery Distpicker
插件描述:distpicker是一款可以实现中国省市区地址三级联动jQuery插件.它使用简单,简单设置即可完成中国省市区地址联动效果. [官网]https://fengyuanchen.github ...
- 省市区js三级联动(原创)
看了一些网上的js三级联动,但感觉不是缺这,就是少那,决定亲自操刀写了一个,现记录如下,以备后用! <!DOCTYPE html> <html> <head> &l ...
- 用php和ajax写一个省市区的三级联动,实现地区的下拉选择
要实现这个页面的三级联动,我们需要建立三个php文件,第一个php文件我们导入jQuery文件,里面嵌入JavaScript:第二个php文件我们做一个php的处理页面,里面引入我们封装好的数据库类文 ...
- 省市区地址三级联动jQuery插件Distpicker使用
插件下载地址 http://www.jq22.com/jquery-info8054 效果如下: 使用: 1.引入js <script src="http://www.jq22.com ...
随机推荐
- iOS、swift、React Native学习常用的社区、论坛
<!----iOS> <!----Swift>*IOS开发常用社区:http://code4app.com/ *IOS开发常用社区:http://www.cocoachina. ...
- makefile编写要点
1.wildcard : 扩展通配符 2.notdir : 去除路径 3.patsubst :替换通配符 格式:$(patsubst <pattern>,<replacement&g ...
- iOS_仿QQ表情键盘
当UITextFiled和UITextView这种文本输入类控件成为第一响应者时,弹出的键盘由他们的一个UIView类的inputView属性来控制,当inputView为nil时会弹出系统的键盘,想 ...
- Python之路,day10-Python基础
一.进程进程:一个程序要运行时所需的所有资源的集合 进程是资源的集合,相当于一个车间 一个进程至少需要一个线程,这个线程为主线程 一个进程里可以有多个线程 cpu cores越多,代表着你可以真正并发 ...
- RestEasy 3.x 系列之四:使用Hibernate_Validator进行数据校验
使用Hibernate_Validator进行数据校验,好处不言而喻:规范统一,低耦合度. 1.pom.xml <dependency> <groupId>org.hibern ...
- spring+mybatis整合读取不了配置文件
报错如下: java.sql.SQLException: unkow jdbc driver : ${jdbc.url}其余错误就不贴了,主要原因是没有读取到配置文件 读取配置文件代码: <be ...
- Vigenère密码
来源 NOIP2012复赛 提高组 第一题 描述 16世纪法国外交家Blaise de Vigenère设计了一种多表密码加密算法--Vigenère密码.Vigenère密码的加密解密算法简单易用 ...
- 0.AutoMapper核心
AutoMapper是基于约定的对象 - 对象映射器.AutoMapper使用流畅的配置API来定义对象 - 对象映射策略.AutoMapper使用基于约定的匹配算法来匹配源到目标值.AutoMapp ...
- java1234教程系列笔记 S1 Java SE chapter 02 lesson 03 java基本数据类型
第二章 第三节 数据类型 3.1 分类 基本数据类型.引用类型 3.2整型 byte 8 short 16 int 32 long 64 作业: A:1-10求和 B:float double 的最 ...
- XFire最佳实践
前言:XFire是新一代WebService框架,同时也支持与Spring集成,帮助我们方便快速地在Spring框架中开发WebService应用. 本节主要介绍XFire+Spring集成的2种常用 ...