二级联动之两种方法实现

 最近学习了ajax，想用ajax做出一个二级下拉联动，刚开没什么头绪，在网上也搜了一些资料，但是用处不怎么大，不过对思维的拓展还是挺有好处的， 下面我就用两种方法来显示二级下拉联动。

 

第一种：不使用ajax技术，这种方法比较复杂。

          （1）  首先将下拉列表展示出来：

            

查询一级目录 <% for (int i=0; i <%=c.getName() %> <% } %>

二级查询目录

        （2）  一级目录已经展示好了， 剩下的就是展示二级目录了， 二级目录的展示要随着一级目录的变化而变化，使用javascript控制， 所以在一级目录中加一事件onchange, 当一级目录中的值改变触发该事件。

 

 

 

（3） 怎样在javascript中根据一级目录中选中的值来动态的改变二级目录中的值，我们首先想想静态的二级联动是怎样实现的，

         

 

(4)   静态联动是， 是每个指定的，先判断在一级目录中选择是哪个， 然后再定义它的长度，最后挨个指定每个option中的值

 

       显然你要去除相应的数据库中的值显示到二级目录中，这种方法是不可取的，那用什么方法呢？

       在 JSP 中 定义一方法，返回的结果是以字符窜，将需要动态生成的代码都写在字符窜里。

 

 

      <%! private String getSecond(List categories, Category topcategory) { StringBuffer buf = new StringBuffer(); buf.append("if(document.form.category1.options[document.form.category1.selectedIndex].value == " + topcategory.getId() + ") { /n"); int childCount = 1; for (int i=0; i

 

（5） 这是需要取出所有的父类别， 每当有一个父类别就将调用一次getSecond方法

         <% List categories = Category.getCategories(); List topcategories = new ArrayList(); String str = ""; for (int i=0; i

 

（6） 到了这步，所有的动态生成的javascript代码已经写在了字符串里；

        

 

(7) 二级联动已经完成了 OK！