我有一个jsp 页面,在上有个 查询的“关键字”,通过该关键字查询出来的数据信息还在本页显示,显示的信息量将近有100个字段,而且其中的两个字段是就是两个 “下拉选项”,第一个下拉有三四十个选项,然后每一个选项下面又分别有10到20个选项,也就是说第二个下拉的选项“总数”有700左右,大家应该知道,并不是每次都列出这么多,只是根据前面选的,在列出相对应的选项出来。因为每条信息的这两个字段都是有值的,所以在查询出来的时候,这两个下拉选项就得选中相应的。我用的是比较笨的方法,因为采用的是struts1,我在action中将一级的三四十个选项查出来,放到一个list对象里面;二级的也全部查询出来,放到另外一个list对象里面,然后将这两个对象通过request.setAttribute(arg0, arg1)设置。
最后分级的时候,我在jsp页面里面做的,用js+Struts1结合起来 初始化两个下拉选项,由于这个页面的信息量也比较的多了,然后还要初始化那两个下拉,所以,在查询出来的那会,要等上一会,也不是很久,只是等的这段时间,大家都会觉得这个页面显示的有点慢了。所以,请教下大家,我这个页面改如何优化?(页面的信息量不能减,因为没这两个下拉选项,也很快的)主要就是如何优化这两个下拉??  好像用Ajax是比较好的选择,但我没在级联下拉这个地方用过。

解决方案 »

  1.   

    我的资源里有个 AJAX 下拉条级联源码。楼主可以去看看。
      

  2.   

    这里有2级级联菜单的介绍可以参考:
    http://tech.ddvip.com/2008-11/122731638194276.html
      

  3.   

    就用ajax好了,当第一个下拉列表改变值的时候触发onchange事件,写个函数接收第一个下拉列表的值,然后根据这个值查询加载第二个下拉列表的值!
      

  4.   

    慢在什么地方?
    1. 是慢在服务器端action加载下拉数据的时候么?如果是,那你把数据放在缓存中,或直接放在application中即可;
    2. 是慢在数据传输过程中?因为你把所有数据都放在了JSP中?如果是,要么把这些数据单独放在一个文件中,如.js文件中,格式为json格式,页面通过JS脚本加载。这样的好处是这个文件也可以被浏览器缓存。要么采用ajax方法,根据第一个选择而动态从服务器端调用数据;总之,对于这些基本不变的共用的数据,一定要做缓存处理。
      

  5.   

    700个不算多。最好是把2个下拉的备选数据都用二维数组保存在jsp页面。然后页面展示的时候构造出来select元素。关键需要对生成的这个select元素做缓存。也就是类似var v = new Element('select');保证那么多的select元素实际只生成2次。然后插入到各行中。
    最后再对每行的第一个select做事件绑定,保证级联的效果。
      

  6.   


    如果是觉得你一起查询出来慢的话就用AJAX去完成 例子很简单 可以去搜(不想搜的回复下 我给你发实例..)
    如果你觉得你用JS获得二级联动慢的话 那就不是AJAX的问题了 一次联动的太多了
      

  7.   

    因为我是把那两个下拉的数据都放在jsp里面,也就是在head中去构建两个数组,就是在这个构建过程比较慢;虽然触发事件的处理也是在本页面处理,但是这里并不慢;就好比查看个人信息一样,只能单个单个的查,所以,我用的这个方法,每次只要用到这个页面(有几个地方用到这个页面),然后就会用重新来一次这个过程;每次都是重新查询数据库,然后request.setA... 然后再在jsp页面先构建数组,最后显示,只要每次都会慢...
      

  8.   

    你可以通过ajax,或者JQuery的方式来做,首先把第一个下拉全部查出来,然后当你选择第一个的时候,就触发一个事件,把下一个查询出来,这样,你想多少级都可以,
      

  9.   

    13楼说的是 打开这个页面后 ,初始化了第一个下拉框,然后再去选,就第二个下拉框有选项了。
    而我的这个情况是 这两个下拉选项的字段,打开页面 就是有选中的值啊。难道我的这个页面,在页面信息在load过程中,显示到这两个下拉的时候,再去请求一次服务器?
      

  10.   

    如果楼主要在页面初始化的时候就将第一级对应的第二级菜单显示出来,我个人感觉用AJAX很困难。用你现在的方法更好些,对于效率问题很遗憾没能给你帮助
      

  11.   

    才二级级联,不难的。
    你首先只加载一级的数据,但默认选项是请选择,
    但你真正选择一个数据的时候,也就是触发了onchange事件,
    通过得到一级的值再加载二级的下拉选项
      

  12.   

    后来又想了想,用onload()方法可以调用dwr写好的方法,只需要查询你下拉框中的数据其他的没必要,不知道这样对你有帮助吗