目中需要用到多级联动菜单，当时找到一个RayChou朋友写的 http://www.raychou.com/labs/linkage-select/ 。因为数据格式是简单的key:value格式，考虑以后项目需求扩展，于是参考这个自己也写了了一个，增加功能及优化事件绑定方式。
?
jQuery无限级联动多属性值下拉菜单
多级联动，支持Ajax动态获取数据并缓存数据，动态生成下级select菜单，设置动态生成"option"第一个条目作为提示项，自动选择唯一选项的菜单，设置回调函数在onChange事件触发时获取下拉菜单相关信息。
?
特点：
1、数据记录可以包含多个属性信息便于前台操作
2、数据来源多样性，可以本地js加载，或者ajax动态获取，甚至本地+ajax动态复合方式（比如本地只加载第一级主要数据，动态获取下级数据）
3、可动态生成下级菜单。可动态隐藏下级菜单。可自定义菜单宽度或者自适应宽度
4、可自定义菜单第一个提示选项（比如“请选择”），可自定义自动隐藏提示选择选项如果数据唯一
5、缓存ajax获得信息。并且如果到达树枝末端两次后将不会对此节点发起新的ajax请求减小服务端负载
6、可自定义onchange回调函数实现多功能
?
详细功能及设置请见 DEMO
?
由于数据结构不同以及信息量不同，所以全国区划代码的本地district-all.js文件比RayChou的要大许多，可以考虑自己裁减或者ajax方式动态获取。
如果是demo本地浏览，则ajax方式将无法获得数据
?
没精力去美化界面，所以页面基本照搬RayChou朋友的 
如果有朋友喜欢甚为高兴，有bug欢迎提出~
?
UPDATE:
?
2010.08.25
?
v1.1
更新到v1.1 新增1个实例方法 changeValues()，更改district-level1.js，district-level2.js内全局变量名称以便
可以同时加载多个地区变量而互相不影响
?
?
2010.08.26 v1.2
更新到v1.2
fix: 在jQueryUI dialog模态窗口下使用时如果下拉列表较长则多次打开窗口后再次打开时FireFox下会出现页面闪动
add: 以下实例方法返回实例对象可链式操作其他方法 changeValues, onChange, reset, resetAll。比如 linkageSel.reset().changeValues([23, 2244]);
mod: 使用缓冲池复用更新菜单时被删除的<option>对象
?
?
2011.05.30 v1.22
fix: ie6判断赋值错误，导致在IE6下JS加载错误。可以在1.2版文件上直接修改
jquery.linkagesel.js 54行：
st.ie6 = true; ------> this.ie6 = true;
jquery.linkagesel-min.js
?{st.ie6=true} --------->? {this.st.ie6=true}
?
?
2011.07.31 v1.24
fix: ie6延时问题，DEMO9无法触发生成联动菜单。
?
chg: 生成<option>方式
upd: 提供兼容jQuery v1.6+的版本，采用.prop()替代.attr()操作对象特性
?
27497003@qq.com
:(
这个是我数据出错的问题，已解决。
新问题，怎么绑定多个select，数据为AJAX
27497003@qq.com
:(
这个是我数据出错的问题，已解决。
新问题，怎么绑定多个select，数据为AJAX
这个‘多个select’指的是什么呢？
一个页面有多个联动菜单对象（比如一个是地区的，一个是公司部门分支的）？
<select id="demo2"></select>
<script type="text/javascript" >
var opts = {
ajax: 'district_crud_aj-demo.php?aj=15', //ajax获取 selStyle: 'margin-left: 3px;',
select: '#demo2'
};
var linkageSel2 = new LinkageSel(opts);
</script>
<select id="demo3"></select>
<script type="text/javascript" >
var opts = {
ajax: 'district_crud_aj-demo.php?aj=15', //再一次ajax获取 selStyle: 'margin-left: 3px;',
select: '#demo3'
};
var linkageSel3 = new LinkageSel(opts);
</script>
只有demo2有效，demo3无法显示数据。
只有demo2有效，demo3无法显示数据。
你说的是DEMO页面不正常还是你自己写的页面不正常？
一个页面中有2个select。且数据都是ajax来获取的。
代码如下：
地区1：<select id="demo2"></select>
<script type="text/javascript" >
var opts2 = {
ajax: 'getdata.php' //获取json数据
selStyle: 'margin-left: 3px;',
select: '#demo2'
};
var linkageSel2 = new LinkageSel(opts2);
</script>
地区2：<select id="demo3"></select>
<script type="text/javascript" >
var opts3 = {
ajax: 'getdata.php', //也是通过ajax获取json数据
selStyle: 'margin-left: 3px;',
select: '#demo3'
};
var linkageSel3 = new LinkageSel(opts3);
</script>
这时只有demo2显示ajax获取的数据，而demo3无法显示ajax获取的数据。
如上代码是否有写的不对的地方？如果没有。您可以测试一下。是不是有这个情况发生。
<select id="demo3" ></select>
</div>
<script type="text/javascript" >
var data1 = {'1':{'name':'abc'},'2':{'name':'abc'},'3':{'name':'abc'}};
var opts = {
ajax: "regsiter!getJsonList.action?idname=-1",
//data:data1,
selStyle: 'margin-left: 3px;',
select: '#demo3'
};
var linkageSel3 = new LinkageSel(opts);
</script>
demo3试验了N次，执行不了。
返回的数据就是data1,不用ajax可以，使用ajax就是不生效了。
其它同志试验过吗？
后台只用接受id参数即可。你可以用firefox的firebug看看DEMO页面提交的查询数据即可
后台只用接受id参数即可。你可以用firefox的firebug看看DEMO页面提交的查询数据即可
迎刃而解！！多谢指点！！！感激不尽
27497003@qq.com
:(
这个是我数据出错的问题，已解决。
新问题，怎么绑定多个select，数据为AJAX
这个‘多个select’指的是什么呢？
一个页面有多个联动菜单对象（比如一个是地区的，一个是公司部门分支的）？
我的意思是动态绑定多级？数据是ajax
例如我要绑定
四川省 成都市 金牛区
我的ajax页面的数据不是一次性全部输入，而是根据上一层父id获取当前级的数据
27497003@qq.com
:(
这个是我数据出错的问题，已解决。
新问题，怎么绑定多个select，数据为AJAX
这个‘多个select’指的是什么呢？
一个页面有多个联动菜单对象（比如一个是地区的，一个是公司部门分支的）？
我的意思是动态绑定多级？数据是ajax
例如我要绑定
四川省 成都市 金牛区
我的ajax页面的数据不是一次性全部输入，而是根据上一层父id获取当前级的数据
我把代码也跌上来吧
var opts = {
ajax: '/inc/getajax2.asp?t=2',
head: '=选择栏目=',
select: '#sltChannel',
defVal: [48, 56]
};
var linkageSel = new LinkageSel(opts);
现在的情况是它只会绑定第一级，剩余的一个生成的select数据是被填充了，但是没有默认选中56
我把代码也跌上来吧
var opts = {
ajax: '/inc/getajax2.asp?t=2',
head: '=选择栏目=',
select: '#sltChannel',
defVal: [48, 56]
};
var linkageSel = new LinkageSel(opts);
现在的情况是它只会绑定第一级，剩余的一个生成的select数据是被填充了，但是没有默认选中56
可能是因为你第二级数据是动态获取的，设定默认的56对其无效。如果第二级数据是在初始化时就存在那么56就有效。
有待改进
我把代码也跌上来吧
var opts = {
ajax: '/inc/getajax2.asp?t=2',
head: '=选择栏目=',
select: '#sltChannel',
defVal: [48, 56]
};
var linkageSel = new LinkageSel(opts);
现在的情况是它只会绑定第一级，剩余的一个生成的select数据是被填充了，但是没有默认选中56
你也可以试试用 在onChange() 中调用 changeValues()方法选择需要的值。请参见DEMO中 demo15.
没看明白你的意思。是否这样：因为程序设计为若通过ajax获得数据，当首次获得数据之后下次被触发时就不会再去ajax远程读数据，而是使用上次获得的已被缓存的数据。所以导致了你的问题？
如果你希望使用ajax数据源的缓存机制而使用js加载数据，并且避免js文件的浏览器缓存，你可以在加载js的时候用小技巧避免浏览器缓存，比如
<script type="text/javascript" src="js/district-all.js?s3z"></script>
给url加上一个随机字符
jquery.linkagesel-min.js 和 jquery.linkagesel.js文件中
请修改为
否则当this.st.loaderImg存在时 '"/>' 无法输出