利用DIV如何实现一个页面动态包含多个页面？

Question

呵呵，可能我的问题提的不是很清楚，
打个比方，我想要的结果是：
  有一个查询页面A；
  点击查询后，在A的下面显示查询的列表页面B，A仍然在顶部；
  点击单条明细，在B的下面显示明细页面C；
  A,B,C三个页面同时显示在一个页面中 -----------------------------------
 |      ----------------------     |
 |     |      页面A           |    |
 |      ----------------------     |
 |      ----------------------     |
 |     |      页面B           |    |
 |      ----------------------     |
 |      ----------------------     |
 |     |      页面C           |    |
 |     ----------------------      |
 |----------------------------------
其实之前用iframe能够实现，但是iframe的自适应高度和页面调整总是出问题，而且也有顾虑项目大，数据量大了之后
iframe会比较慢，所以想考虑下用DIV实现不知道有没有高手指点下？不胜感激

Answer 1

可以使用div层来实现，在A页面使用一个div，点击查询调用一个方法来把B页面load进来，同时B页面中也有div,点击明细后在B的div中加载C页面，出现的就是你说的那种效果了

Answer 2

你这个布局用ul+li  +  div，很好做的 ，如果你会jQuery，他里面有个方法是将页面包含进来的

Answer 3

你也可以把四块内容都弄出来，然后在页面上都显示出来，
然后通过CSS对每个DIV进行显示或者隐藏设置。好处就是快，坏处就是右间，源代码的话可以看到隐藏的内容

Answer 4

jQuery 里面有一个load方法就用来加载一个页面的
例:$("#divID").load("A.html");

Answer 5

我也想过用load方法，但问题是，我的B页面时根据A页面的条件动态查询出来的，也就是说不是静态页面，中间还需要通过Action

Answer 6

可以使用div层来实现，在A页面使用一个div，点击查询调用一个方法来把B页面load进来，同时B页面中也有div,点击明细后在B的div中加载C页面，出现的就是你说的那种效果了

Answer 7

1)如果 三个页面的查询数据量不大  用一个大的JSP 直接 include  这三个jsp 就行了2)如果 三个页面查询数据量比较大，最好还是ajax 用户 点击了那个区域，然后再显示

Answer 8

典型的AJAX + JavaScript控制DOM动态显示.

Answer 9

其实说的都是一个原理, 其实就是用js,css控制了一下隐藏

Answer 10

这个不错。。如果用ajax也可以实现

Answer 11

我用了load方法，确实能够加载进来了，但是加载以后出现一个问题，我之前的按钮js失效了，再次点击就无效了！这是什么原因？我看网上说load方法返回以后会把script标头去除？
试试get方法看！

Answer 12

找到了问题所在，原因除在重新点击，没有从后台查询，而是直接去找了IE缓存
可以通过配置禁止访问IE缓存，就是在load方法前加入如下代码：$.ajaxSetup ({
  cache: false //close AJAX cache
});具体如下：      function queryUserMap(roleId){
        $.ajaxSetup ({
  cache: false //close AJAX cache
       });
       $("#div4").load("queryUserMap.action"+roleId, callback());
      }