转:JQuery实现下拉框的数据加载和联动
<script type="text/javascript">
$(document).ready(function() {
GetByJquery();
$("#ddlProvince").change(function() { GetCity() });
$("#ddlCity").change(function() { GetDistrict() });
}); function GetByJquery() { $("#ddlProvince").empty(); //清空省份SELECT控件 $.getJSON("/ajax/GetProvinceList", function(data) {
$.each(data, function(i, item) {
$("<option></option>")
.val(item["ProvinceID"])
.text(item["ProvinceName"])
.appendTo($("#ddlProvince"));
});
GetCity();
}); } function GetCity() { $("#ddlCity").empty(); //清空城市SELECT控件
var url ="/ajax/GetCityList/" + $("#ddlProvince").val();
$.getJSON(url, function(data) {
$.each(data, function(i, item) {
$("<option></option>")
.val(item["CityID"])
.text(item["CityName"])
.appendTo($("#ddlCity"));
});
GetDistrict();
});
} function GetDistrict() {
$("#ddlDistrict").empty(); //清空市区SELECT控件
var url = "/ajax/GetDistrictList/" + $("#ddlCity").val(); $.getJSON(url, function(data) {
$.each(data, function(i, item) {
$("<option></option>")
.val(item["DistrictID"])
.text(item["DistrictName"])
.appendTo($("#ddlDistrict"));
});
});
} </script> <table>
<tr>
<td><select id="ddlProvince"/></td>
<td><select id="ddlCity"/></td>
<td><select id="ddlDistrict" /></td>
</tr>
</table>
转自:http://group.cnblogs.com/topic/9741.html
转:JQuery实现下拉框的数据加载和联动的更多相关文章
- 在element-ui的select下拉框加上滚动加载
在项目中,我们需要运用到很多来自后端返回的数据.有时是上百条,有时甚至上千条.如果加上后端的多表查询或者数据量过大,这就导致在前端的显示就会及其慢,特别是在网络不好的时候更是如此. 自然,后端就做了一 ...
- el-select实现下拉框触底加载更多
当下拉框需要展示的数据有很多时,几千甚至上万条,一次性全部请求回来再按照特定格式比如 id-name 去处理数据的话,不论是从接口还是前端,这个性能都不是很好,会造成下拉框初次打开时响应很慢,影响用户 ...
- combotree -下拉框树异步加载
问题: 下拉树数据比较多时,全加载会产生页面延迟,需要实现异步加载 方案: 点击事件加载:先加载部分,点击节点时再展开并追加子节点 onBeforeExpand事件:在展开树前加载,感觉这种方式比较优 ...
- 实现select下拉框的无限加载(懒加载)
在实际开发中我们有时无法避免select下拉功能数据过大导致页面卡顿(如在我在一次迭代中有一个select项接口返回了5000多条数据).用户体验差!结合实际开发给出了3个解决方案: 方案1.sele ...
- jQuery对下拉框Select操作总结
jQuery对下拉框Select操作总结 转自网络,留做备用 jQuery获取Select元素,并选择的Text和Value: 1. $("#select_id").change( ...
- JQuery打造下拉框联动效果
做联动效果,若是用纯JavaScript来做,往往须要辅助页面保存须要刷新的结果集,然后渲染到原页面.考虑将须要动态刷新的内容自己主动拼接到前一个下拉框之后,当前一个下拉框onchange后,同级的后 ...
- jquery div 下拉框焦点事件
这章与上一张<jquery input 下拉框(模拟select控件)焦点事件>类似 这章讲述div的焦点事件如何使用 div的焦点事件与input的焦点事件区别在于 需要多添加一个属性: ...
- jQuery 滚动条 滚动到底部(下拉到底部) 加载数据(触发事件、处理逻辑)、分页加载数据
1.针对浏览器整个窗口滚动 主要代码: <script type="text/javascript"> ; function GetProductListPageFun ...
- Jquery操作下拉框(DropDownList)实现取值赋值
Jquery操作下拉框(DropDownList)想必大家都有所接触吧,下面与大家分享下对DropDownList进行取值赋值的实现代码 1. 获取选中项: 获取选中项的Value值: $('sele ...
随机推荐
- php Hash Table(三) Hash Table初始化
HashTable初始化,在使用HashTable之前要先执行初始化,下边就看看初始化时都做了什么, Zend/zend_hash.c static const Bucket *uninitializ ...
- Linux环境PHP5.5以上连接SqlServer2008【全网最经典无错版】
原文地址:http://blog.csdn.net/21aspnet/article/details/47451253 linux版本:64位CentOS 6.4 Nginx版本:nginx1.8.0 ...
- 浅谈JavaScript中的正则表达式
引言 对于正则表达式我想作为程序员肯定使用过它,那天书般的表达方式,我用一次就记住它了.这篇博客先介绍一些正则表达式的内容,然后介绍JavaScript中对正则表达式特有的改进.下面开始介绍正则表达式 ...
- Html.RenderPartial、Html.RenderAction联系与区别
1.引言 开发人员经常希望应用程序可以在多个不同的地方使用同样的Razor标签和HTML标记代码.这并不需要我们在多个地方重复这些标签,使用MVC中的分部视图和子动作可以让我们很好的解决类似的情况. ...
- webapi支持跨域访问
写在前面 在实际应用中,跨域请求还是比较常见的,如何上接口直接支持跨域的访问呢? demo 场景项目A有个接口用来获取用户列表,现在项目b也有个功能需要加载用户列表.这两个项目在两个域名下,至少端口好 ...
- 【转】apache kafka监控系列-KafkaOffsetMonitor
apache kafka监控系列-KafkaOffsetMonitor 时间 2014-05-27 18:15:01 CSDN博客 原文 http://blog.csdn.net/lizhitao ...
- 使用cachemanager做缓存(Session的缓存)
1.我在这里直接用 cachemanager.redis 往redis里面存储缓存数据2.步骤 1)下载CacheManager.Redis(包含了CacheManager.Core) 下载Stack ...
- 一次关于使用status作为变量引发的bug及思考
这个bug出现在一年前,当时自己大学还没毕业,刚刚进入一家公司实习.那个时候还没有用seajs或者requirejs那样的模块化管理的库,也没有用一个自执行的函数将要执行的代码包裹起来,于是bug就在 ...
- 如何去各型MCU的官网上下载正确的数据手册
一.背景 感谢老司机左栋,虽然他一直很排斥这个名号 : ) ,可就技术上来说,还是当之无愧的. 弄了1年多单片机了,数据手册不是老员工或者头头给,就是从开发板资料拿.一直没有意识到,官网的东西才是最可 ...
- 2015baidu复赛 矩形面积(包凸 && ps:附quickhull模板)
矩形面积 Time Limit: 2000/1000 MS (Java/Others) Memory Limit: 32768/32768 K (Java/Others)Total Submis ...