DIV 局部刷新

 1  web开发中我们经常会遇到局部刷新页面的需求,以前我经常使用ajax和iframe实现局部刷新,后来做政府的项目,对页面的样式要求比较多,发现使用iframe控制样式什么的很麻烦,所以就采用了新的办法,就是下面我们要说的ajax配合div局部刷新页面,其实很简单,下面我们就看一下这种刷新方式是如何实现的。
 2 jsp页面ajax代码如下:
 3 <span style="font-size:18px;line-height: 28px;">$("#waitWork").click(function(){
 4         var url = "请求地址";
 5         var data = {type:1};
 6         $.ajax({
 7             type : "get",
 8             async : false,  //同步请求
 9             url : url,
10             data : data,
11             timeout:1000,
12             success:function(dates){
13                 //alert(dates);
14                 $("#mainContent").html(dates);//要刷新的div
15             },
16             error: function() {
17                // alert("失败,请稍后再试!");
18             }
19         });
20     });
21 </span>
22 <span style="font-size:18px;line-height: 28px;"><div id="mainContent"></span><span style="line-height: 21px; font-size: 12px;">
23 </span>
24 注意:后台需要针对div里的信息单独用一个jsp页面,不然就需要自己封装好需要的页面信息返回
25 这个方法可以实现单独刷新一个div,好用的一点就是:如果将div里需要的信息单独放到一个jsp页面里,都不需要我们后台拼装数据了,非常方便。

 

posted @ 2017-12-06 10:24  朴pu客  阅读(2653)  评论(0编辑  收藏  举报