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的使用)的更多相关文章

  1. 省市区(县)三级联动代码(js 数据源)

    ylbtech-JavaScript-Utility:省市区(县)三级联动代码(js 数据源) 省市区(县)三级联动代码(js 数据源) 1.A,源代码(Source Code)返回顶部 1.A.1, ...

  2. js之省市区(县)三级联动效果

    省市区(县)三级联动效果,是我们软件开发比较常用的,特别是对一些crm,erp之类,当然也包括其他的后台管理系统,基本都涉及到,今天贴出这个常用的,方便个人复用和大家使用 <!DOCTYPE h ...

  3. 中国省市区地址三级联动jQuery插件 案例下载

    中国省市区地址三级联动jQuery插件 案例下载 distpicker 是一款可以实现中国省市区地址三级联动jQuery插件.它使用简单,简单设置即可完成中国省市区地址联动效果. 安装 可以通过npm ...

  4. JQuery实现省市区的三级联动

    JQuery实现省市区的三级联动 <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "h ...

  5. JavaScript实现省市区的三级联动

    JavaScript实现省市区的三级联动 <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" &qu ...

  6. 中国省市区地址三级联动插件---jQuery Distpicker

    插件描述:distpicker是一款可以实现中国省市区地址三级联动jQuery插件.它使用简单,简单设置即可完成中国省市区地址联动效果. [官网]https://fengyuanchen.github ...

  7. 省市区js三级联动(原创)

    看了一些网上的js三级联动,但感觉不是缺这,就是少那,决定亲自操刀写了一个,现记录如下,以备后用! <!DOCTYPE html> <html> <head> &l ...

  8. 用php和ajax写一个省市区的三级联动,实现地区的下拉选择

    要实现这个页面的三级联动,我们需要建立三个php文件,第一个php文件我们导入jQuery文件,里面嵌入JavaScript:第二个php文件我们做一个php的处理页面,里面引入我们封装好的数据库类文 ...

  9. 省市区地址三级联动jQuery插件Distpicker使用

    插件下载地址 http://www.jq22.com/jquery-info8054 效果如下: 使用: 1.引入js <script src="http://www.jq22.com ...

随机推荐

  1. java程序员烂大街为何还不便宜?

    最近跟一朋友聊天,他是做c#开发的.他答应了老板带领一帮java工程师开发网站.披星戴月终于搞定,现在已经盈利.但是他公司的那帮搞c#的同事不淡定了. 在招聘java程序员的时候2年有开15k的.5年 ...

  2. tomcat7 启动项目报错 java.lang.NoSuchMethodError: javax.servlet.ServletContext.getSessionCookieConfig()

    JDK版本:jdk1.8.0_77 Tomcat 版本:apache-tomcat-7.0.47 异常重现步骤: 1.完成项目部署 2.启动Tomcat 异常头部信息:java.lang.NoSuch ...

  3. Python初学的易犯错误

    当初学 Python 时,想要弄懂 Python 的错误信息的含义可能有点复杂.这里列出了常见的的一些让你程序 crash 的运行时错误. 1)忘记在 if , elif , else , for , ...

  4. 顶点缓存对象(VBO)

    创建VBO 绘制VBO 更新VBO 实例 GL_ARB_vertex_buffer_object扩展致力于提供顶点数组与显示列表的优势来提升OpenGL效率,同时避免它们实现上的不足.顶点缓存对象(V ...

  5. 【阿迪达斯 ZX850 系列】

    [阿迪达斯zx850系列 灰蓝桔 36-44] [阿迪达斯 ZX850 新配色B34720 情侣鞋 36-44] [阿迪达斯 ZX850 新配色B34720 情侣鞋 36-44] [阿迪达斯 ZX85 ...

  6. 2016-12-15 java开发工作中,尚未做的工作

    目前未涉及的工作内容: 1.将静态页导入工程,建成jsp文件.配置css.js.img文件.跳转路径 2.未用工具生成pojo dao service等源码文件 3.未签入自己写的代码 4.未搭建子系 ...

  7. 调用C++动态链接库出现错误

    解决方式:将托管 System.String 中的内容复制到非托管内存(Marshal.StringToHGlobalAnsi) class HttpsSend { [DllImport(" ...

  8. android学习笔记57——电话管理器TelephoneyManager

    电话管理器TelephoneyManager

  9. React JSX语法说明

    原文:http://my.oschina.net/leogao0816/blog/379487 什么是JSX? 在用React写组件的时候,通常会用到JSX语法,粗看上去,像是在Javascript代 ...

  10. VS2010 下 将 EntityFramework 的版本从 4.0 升级到 5.0

    1. 下载安装 EF 5.x DbContext Generator for C# : 下载地址:https://visualstudiogallery.msdn.microsoft.com/da74 ...