描述:Chained 是一个简单易用的轻量级 jQuery 多级联动插件,使用它可快速创建多级联动的下拉列表。它通过在 Select 中设置 class 样式名来关联上级列表,下拉列表数据来源多样性,可以从本地 js 加载,或者使用 AJAX 从服务器端异步获取 JSON 数据。更重要的是它完美支持多种浏览器,没有兼容性问题。
兼容浏览器:IE6+/Firefox/Google Chrome
官方链接:暂无
JS下载: http://www.ijquery.cn/js/jquery.chained.js
预览: http://www.ijquery.cn/study/demo/chained
打包下载: http://www.ijquery.cn/study/demo/chained/chained.zip
参数说明: 无
图片展示:
JS引用代码:
[js]
<script type="text/javascript" charset="utf-8" src="http://www.ijquery.cn/js/jquery-1.4.2.min.js"></script>
<script type="text/javascript" charset="utf-8" src="http://www.ijquery.cn/js/jquery.chained.js"></script>
<script type="text/javascript">
$(function () {
$("#series").chained("#mark"); //注:#series是二级的id,#mark是一级的id
});
</script>
[/js]
HTML代码:
说明:只要二级的option设置的class的属性是一级的value的值就可以了!
如一级<select id="series"><option value="bmw">BMW</option></selected>,
二级<option value="series-1" class="bmw">
[html]
<form>
<select id="mark">
<option value="">--</option>
<option value="bmw">BMW</option>
<option value="audi">Audi</option>
</select>
<select id="series">
<option value="">--</option>
<option value="series-1">1 series</option>
<option value="series-3">3 series</option>
<option value="series-5">5 series</option>
<option value="series-6">6 series</option>
<option value="series-7">7 series</option>
<option value="a1">A1</option>
<option value="a3">A3</option>
<option value="s3">S3</option>
<option value="a4">A4</option>
<option value="s4">S4</option>
<option value="a5">A5</option>
<option value="s5">S5</option>
<option value="a6">A6</option>
<option value="s6">S6</option>
<option value="rs6">RS6</option>
<option value="a8">A8</option>
</select>
</form>
[/html]
CSS代码:无