js页面局部刷新问题

求教这个局部刷新的东西该怎么弄呀。。。。
源码是下面的这个,我想实现的功能是在左边的dtree中点击之后,在中间的黄色区域显示
<%@ page contentType="text/html; charset=utf-8" language="java" import="java.sql.*" errorPage="" %>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>DTree</title>
<link rel="StyleSheet" href="css/dtree.css" type="text/css" />
<script type="text/javascript" src="js/dtree.js"></script>
</head>

<body>
<div style="width:100% auto; border:1px">
<div id="top" style="height:100px; background:pink">头部</div>
<div id="middle" style="height:500px; width:100%">
<div id="left" style="width:18%; height:500px; float:left;">
<h2><b>主菜单</b></h2>
<p><a href="javascript:d.openAll();"></a>
|<a href="javascript:d.closeAll();">折叠全部</a></p>
<jsp:useBean id="tree" class="Beans.Dtree">
<jsp:getProperty name="tree" property="treeNode" />
</jsp:useBean></iframe>
</iframe></div>
<div id="main" style="width:82%; background:yellow; height:500px; float:left">中间</div>
</div>
<div id="button" style="width:100%; height:30px; background:black">底部</div>
</div>
</body>
</html>
最好能提供详细的代码及注释,谢谢
上面的servlet代码放不完,放在这个位置了,
左边的代码是用dtree.js生成的,我现在改不了,大师,帮我弄一下吧,我还有一事不明,就是在servlet中写上这段代码
public void doGet(HttpServletRequest request, HttpServletResponse response)
throws ServletException, IOException {
request.setCharacterEncoding("gb2312");
String url=request.getServletPath();
System.out.println("Url="+url);
if(url.equals("/Check/Class.do")){
String t = "index.jsp";
request.setAttribute("t",t);
request.getRequestDispatcher("/index.jsp").forward(request, response);
}
}
index.jsp是存在根目录的,这样写了之后跳转的时候就不能正确跳转到index.jsp上。而是跳到了/Check/index.jsp上,这是为什么呢?

第一种方法,在你的代码基础上:
1、假设左边tree的html结构:
<ul id="tree">
<li><a href="javascript:void(0)" link="format.html">课表查询</a></li>
<li><a href="javascript:void(0)" link="1.html">信息修改</a></li>
</ul>
//注意以上a元素的link属性代表中间将要显示的页面的名称,根据需要自行修改

2、引入jquery库,在head之间添加如下代码:
$(function(){
var $tree_a = $("#tree").find("a");//获取tree中的a元素集合
var $main = $("#main");//获取中间部分元素
$tree_a.on("click", function(){
$main.empty();//初始化
var $frame =$("<iframe></iframe>");//定义框架对象
var $this = $(this);//当前被点击的tree的a
$frame.attr({//设置中间部分框架的属性
"src": $this.attr("link"),//框架引入的页面地址
"name": "main_frame",//框架名称
"width": $main.width() || "100%",//框架宽度
"height": $main.height() || "100%",//框架高度
"frameborder": "0",//框架边框
"scrolling": "auto"//框架滚动条设置
});
$frame.appendTo($main);//将框架插入到中间部分
});
});

第二种方法,改变你的代码结构:
1、修改html结构,将中间部分更改为iframe

<div id="main" style="width:82%; background:yellow; height:500px; float:left">中间</div>
</div>
这段代码修改为
<ifame name="main" src="" id="main" frameborder="0" width="82%" height="500px" scrolling="auto"></iframe>

2、修改左侧tree的a元素
<a target="main" href="...">课表查询</a>
......

有问题请留言追问

左边的代码是用dtree.js生成的,我现在改不了,大师,帮我弄一下吧,我还有一事不明,就是在servlet中写上这段代码
public void doGet(HttpServletRequest request, HttpServletResponse response)
throws ServletException, IOException {
request.setCharacterEncoding("gb2312");
String url=request.getServletPath();
System.out.println("Url="+url);
if(url.equals("/Check/Class.do")){

追答

你不用改dtree.js生成的代码,我给你写的代码是示例代码,你要根据dtree.js生成的具体情况而作相应的修改。

下面servlet代码你想问什么?

温馨提示:答案为网友推荐,仅供参考
第1个回答  2012-12-15
<frameset rows="63,*,23" frameborder="no" border="0" framespacing="0">
<frame src="top.jsp" name="topFrame" scrolling="no"
noresize="noresize" id="topFrame" />
<frame src="center.jsp" name="mainFrame" id="mainFrame" />
<frame src="down.jsp" name="bottomFrame" scrolling="no"
noresize="noresize" id="bottomFrame" />
</frameset>
<noframes>
自己参考下吧

相关了解……

你可能感兴趣的内容

本站内容来自于网友发表,不代表本站立场,仅表示其个人看法,不对其真实性、正确性、有效性作任何的担保
相关事宜请发邮件给我们
© 非常风气网