Jquery联动下拉菜单

用Jquery 1.4.4 实现的联动下拉菜单，估计在Jquery 1.2版本以上都可用。

联动下拉菜单是一主一从两个select，切换主select时，从select的内容跟着改变。这里是把从select的项目按组optgroup全部加载进来，然后切换主select时更新从select组的显示或者隐藏。注意从select的组次序和主select项次序要一致。

   HTML代码

1.   
2.   广东  
3.   江苏  
4.   福建  
5.   
6.   
7.   
8.   （全部）  
9.     
10.     广州  
11.     深圳  
12.     
13.     
14.     南京  
15.     苏州  
16.     
17.     
18.     福州  
19.     厦门  
20.     
21.   

   JS代码

1. function double_select(master, slave){  
2.   
3.     var change_slave = function() {  
4.   
5.         var idx = $(master).attr("selectedIndex") + 1;  
6.   
7.         $(slave).children("optgroup").hide();  
8.   
9.         $(slave).children("optgroup:nth-child("+idx+")").show();  
10.   
11.     }  
12.   
13.     $(master).change( change_slave );  
14.   
15.     change_slave();  
16.   
17. }  
18.   
19. //使用  
20. $(function(){  
21.     double_select("#province", "#city");  
22. });