js异步刷新局部页面

真不想说博客园的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异步刷新局部页面

最新文章

热门文章