`
- 浏览:
483736 次
- 性别:
- 来自:
北京
-
http://blog.csdn.net/longaohun/article/category/792984
彦磊基于jQuery省市县联动插件演示
演示地址:http://www.391zx.com/yl/YlChinaDemo.html
技术支持:http://hi.baidu.com/dpxdqx
下载地址:http://www.jztg.net/yl/YLChinaArea.rar
彦磊基于jQuery省市县联动插件(2009.04)
在IE6/IE7/Mozilla 5.0(Firefox 3.0.5)中测试通过
此插件功能
1、不需要数据库支持,速度快。
2、支持初始设置哪些省市县为选中状态、从而可以有网页编辑页面调用已经保存的数据库数据。
3、在ASP.NET中简单添加D三个HiddenField控件便可以获取前台页面选择的省市县数据。
4、基于REQUERY,表现和行为分离,设置简单方便,详细见使用方法。
此插件要求运行在jQuery v1.3 或更高版本上
插件改编自RayChou(http://www.raychou.com)的“全国省市区三级联动下拉菜单”插件。
更多JQUERY插件请访问彦磊的百度博客:HTTP://HI.BAIDU.COM/DPXDQX,
此为自由拷贝版本,您可以在此基础上添加任何功能
彦磊建议您将修改过的版本或发布地址发到彦磊博客上以共享,也建议您保留部分彦磊的信息
使用前您一定要引入jQurey及压缩包中的两个脚本文件,如
<script type="text/javascript" src="js/jquery_last.js"></script>
<script type="text/javascript" src="js/location.js"></script>
<script type="text/javascript" src="js/YlChinaArea.js"></script>
使用方法:
1、为您要设置省市县联动下拉框设置容器,如"ChinaArea"
2、在容器中添加三个select元素,请不要再添加其它任何元素,同时按省、市、县区的顺序安排三个选择框。
<div class="ChinaArea">
<select id="province" name="province" style="width: 100px;"></select>
<select id="city" name="city" style="width: 100px;"></select>
<select id="county" name="county" style="width: 120px;"> </select>
</div>
在ASP.NET中,您需要多添加三个服务器控件:隐藏字段,您选择的省市县数据将在客户端由程序分别写入三个隐藏字段中
请您注意三个隐藏字段按顺序分别存储省、市、县区的数据,顺序不能随意调整,同时您不要在容器中添加其它元素,特别是select和input元素。
<div class="ChinaArea">
<select id="province" style="width: 100px;"></select>
<select id="city" style="width: 100px;"></select>
<select id="county" style="width: 120px;"> </select>
<asp:HiddenField runat="server" ID="Tprovince" />
<asp:HiddenField runat="server" ID="TCity" />
<asp:HiddenField runat="server" ID="TCounty" />
</div>
在asp.net的代码页中您可以通过获取三个隐藏字段的value值来获取您选择的省市县。
3、在页面中添加jQuery语句,调用此插件,并对相关参数进行设置,如:
<script type="text/javascript">
$(document).ready(function() {
$("#ChinaArea").jChinaArea();
});
</script>
4、在ASP.NET中,您需要通过下面语句来调用,即设置参数aspnet的值为true.
<script type="text/javascript">
$(document).ready(function() {
$("#ChinaArea").jChinaArea({aspnet:true});
});
5、初始化时您可以定义选择哪些省市县,如
<script type="text/javascript">
$(document).ready(function() {
$("#ChinaArea").jChinaArea({
aspnet:true,
s1:"河南省",//默认选中的省名
s2:"安阳市",//默认选中的市名
s3:"文峰区"//默认选中的县区名
});
});
</script>
具体参数:
aspnet-true或false.默认为false。即是否在ASP.NET中使用,
如果在asp.net中使用,则设为true,并按照第2步中所说方法添加三个隐藏字段,程序会把选择的内容分别写入三个控件中
从而使asp.net可以获取您选择的省、市、县区内容。
s1-默认选中的省名称,在程序中您可以用这个值来初始省份的选中项,如s1:<%=rs("Province")%>
s2-默认选中的市名称,用法同上。
s3-默认选中的县区名称,用法同省。
分享到:
Global site tag (gtag.js) - Google Analytics
相关推荐
jquery省市县联动下拉框,jquery省市县联动菜单,经常用这个,很爽,全国城市数据都是最新的
jQuery移动端省市二级联动选择插件.zip
三种省市县联动Jquery插件,无数据库。总有一款适合你。 三种省市县联动Jquery插件,无数据库。总有一款适合你。 三种省市县联动Jquery插件,无数据库。总有一款适合你。
省市区联动jquery插件 效果看这个 http://www.anchen8.net/test/ssq/index.html
是一个jquery省市区三级联动,支持默认设置省、市、区,数据很全,调用简单,浏览器兼容很好,需要的下载试试吧
jQuery--省市区联动插件适用于移动端开发
jquery根据省市县(区)数据库表做的地区联动, 根据省市县(区)数据库表做的地区联动.
通过city-picker.js插件制作的一个jQuery省市区三级联动插件
jquery省市县 三级联动
使用jquery实现省市联动的例子,里面使用的是select控件,没使用数据库
纯js省市联动插件 ,实现省市区三级联动,省市区三级联动
jquery省市县三级联动的三个例子,总有一个适合你。
jQuery省市区三级联动插件city-picker,省市区三级联动demo
jquery省市县三级联动.rar jquery省市县三级联动.rar jquery省市县三级联动.rar
jquery-1.8.0.min.js版本jquery,该插件并非是省市级联动,省市级联动五级插件数据量太大,不便于个人需求修改,该插件轻量级方便易用!
jquery + Xml 实现省市县联动数据
javaScript jQuery 省市联动
jQuery省市区三级联动
jquery插件城市二级联动 使用简单 数据是以微信地区数据为例
jquery的省市县联动,数据完整,一个input框搞定。