真不想说博客园的Markdown编辑器,我发表到我的个人博客上多好看的一篇文章,发到博客园上格式就成这个鸟样了,哎,不发现到博客首页了,就个人存个档吧

最近在做一个异步刷新页面中的局部,这样做可以防出闪白和已选数据的丢失,话不多说,下面介绍怎么实现的

其中在要实现局部刷新的A.jsp页面中实现代码:

function freshTable(url, beginTime, endTime, selectType, node, page){
$.ajax({
type: "POST",
url: url,
data: {beginTime: beginTime,
endTime: endTime,
selectType: selectType,
node: node,
page: page},
dataType: "html",
cache: false,
async : true,
contentType:"application/x-www-form-urlencoded;charset=utf-8",
success: function(value){
$("#show").html(value);
},
error: function() {
}
});
}

data是要传给后台的参数,后台以获取这些参数如下所示例:

import javax.servlet.http.HttpServletRequest;//导入的包

//获取页面传递过来的ID
HttpServletRequest request=(HttpServletRequest)ActionContext.getContext().get(ServletActionContext.HTTP_REQUEST);
String beginTime = request.getParameter("beginTime");//开始时间
String endTime = request.getParameter("endTime");//结束时间

value是返回页面的源代码

$("#show").html(value);show是要刷新的div的id,如下:

<div id="show"></div>
<action name="ajaxAction" class="AjaxAction">
<result name="success">/B.jsp</result>
</action>

url可以是.jsp文件,不过我们用ssh框架一般都是传action进去,如果是.jsp文件,那么我们就是从.jsp里生成下面的value数据。从action进去的话,url也就是一个action,进入到action后,还是跟平常的一样取list等数据传出来,但传出来的数据不一定是返回A.jsp文件里面,返回哪个页面,这要看你strut.xml文件里面此action的返回是什么了。如果你返回的是A.jsp界面的话,上面的value数据其实就是A.jsp的源代码。下面我们新建一个B.jsp文件,来接收后台传回来的值且是<div id="show"></div>要替换的内容

先把struts.xml文件里面的action配返回的界面为B.jsp

这样,我们从后台返回的List数据就传给B.jsp页面了。

<%@ page language="java" contentType="text/html; charset=utf-8" pageEncoding="utf-8"%>
<%@ taglib prefix="s" uri="/struts-tags"%>
<table class="listTable" border="0" cellpadding="0" cellspacing="0">
<s:iterator id="list01" value="warningInfomationList" status="st" var="wil">
<s:if test="#st.index % 2 == 0">
<tr class="normalRow">
</s:if>
<s:else>
<tr class="alternateRow">
</s:else>
<td width="140px">${wil}</td>
<td width="190px">${meter.meter_Name}</td>
<td width="90px">${msgType.warningType_Name}</td>
<td>${content}</td>
</tr>
</s:iterator>
</table>

后台传表给数据给B.jsp页面生成源代码后,此时ajax中的value等于B.jsp页面的源代码。再经过$("#show").html(value);传给id号为show的div,就这样,局部刷新就完成了。

js异步刷新局部页面的更多相关文章

  1. Ajax异步刷新局部页面的小李子

    看到下面那幅图没有,我们要的是当点击确定以后,根据条形码搜索出商品信息,并且异步刷新右边页面:

  2. jQuery实现AJAX定时刷新局部页面实例

    本篇文章通过两种方法实例讲解ajax定时刷新局部页面,当然方法有很多种,也可以不使用ajax来刷新页面,可以使用jquery中的append来给指定内容加东西,但是都不太实用,最实用的方法还是ajax ...

  3. js将 HTML 页面生成 PDF 并下载

    最近碰到个需求,需要把当前页面生成 pdf,并下载.弄了几天,自己整理整理,记录下来,我觉得应该会有人需要 :) 先来科普两个插件: html2Canvas 简介 我们可以直接在浏览器端使用html2 ...

  4. JS定时刷新页面及跳转页面

    JS定时刷新页面及跳转页面 Javascript 返回上一页1. Javascript 返回上一页 history.go(-1), 返回两个页面: history.go(-2); 2. history ...

  5. 局部页面传值Model

    1:新建个局部页面,将这里页面的Model数据传递过去,在局部页面进行和一般页面一样的操作就行. 这里和HTML.Action不一样,对于HTML.action来说,它是新建了一个action来进行传 ...

  6. 常用的js跳转页面方法实现汇总

    1.window.location.href方式 <script language="javascript" type="text/javascript" ...

  7. js和jquery页面初始化加载函数的方法及先后顺序

    运行下面代码.弹出A.B.C.D.E的顺序:A=B=C>D=E. jquery:等待页面加载完数据,以及页面部分元素(不包括图片.视频), js:是页面全部加载完成才执行初始化加载. <! ...

  8. js关闭当前页面(窗口)的几种方式总结(转)

    js关闭当前页面(窗口)的几种方式总结     1. 不带任何提示关闭窗口的js代码 代码如下 <a href="javascript:window.opener=null;windo ...

  9. atitit. js 跨界面 页面 web cs 传值方法总结

    atitit. js 跨界面 页面 web cs 传值方法总结 #--需求 js #---两个方法:   直接传跟跟间接传递... 1.直接传跟new form(param)    web使用url方 ...

随机推荐

  1. 第一次安卓android studio安装,常见问题。

    出处:纸月 托了很久终于开始学习安卓了,之前看课本教程<第一行代码>用的是eclipse,但后来它不支持了就决定用android studio,第一次安装就出现了一些小的问题 第一个是关于 ...

  2. Java并发编程--并发容器之Collections

    在JDK1.2之前同步容器类包括Vector.Hashtable,这两个容器通过内置锁synchronized保证了同步.后面的ArrayList.LinkedList.HashMap.LinkedH ...

  3. ubuntu 安装lightgbm

    前提:安装好git.cmake 1. 安装lightgbm git clone --recursive https://github.com/Microsoft/LightGBM 2. 编译 下载好的 ...

  4. 内核中container_of宏的详细分析【转】

    转自:http://blog.chinaunix.net/uid-30254565-id-5637597.html 内核中container_of宏的详细分析 16年2月28日09:00:37 内核中 ...

  5. Linux驱动总结3- unlocked_ioctl和堵塞(waitqueue)读写函数的实现 【转】

    转自:http://blog.chinaunix.net/uid-20937170-id-3033633.html 学习了驱动程序的设计,感觉在学习驱动的同时学习linux内核,也是很不错的过程哦,做 ...

  6. JSON和JSONP详解

    什么是JSON JSON是一种基于文本的数据交换方式,或者叫做数据描述格式,你是否该选用他首先肯定要关注它所拥有的优点. JSON的优点: 1.基于纯文本,跨平台传递极其简单: 2.Javascrip ...

  7. table下tbody滚动条与thead对齐的方法且每一列可以不均等

    1 前言 table下tbody滚动条与thead对齐的方法,开始在tbody的td和thead的tr>td,对每一个Item加入百分比,结果是没对齐.也尝试了用bootstrap的col-md ...

  8. 怎样使用github

    https://www.zhihu.com/question/20070065 https://www.shiyanlou.com/courses/868/labs/3163/document 初次尝 ...

  9. 并发之AQS原理(三) 如何保证并发

    并发之AQS原理(三) 如何保证并发 1. 如何保证并发 AbstractQueuedSynchronizer 维护了一个state(代表了共享资源)和一个FIFO线程等待队列(多线程竞争资源被阻塞时 ...

  10. poj3410单调队列(单调栈)

    思路:求每个人的左使者就是从左到右把每个人加入到单调队列中去,加入时最后一个出队的就是那个最大的小于这个数的数 求右信使同理 由于本题的单调队列队头不需要出队,所以其实是一个单调栈 /* 每个人只要找 ...