zoukankan      html  css  js  c++  java
  • 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,就这样,局部刷新就完成了。

  • 相关阅读:
    forEach 获取下标信息
    js select选择框回显 当value是汉字时
    java 大写字符串字符串转成小写驼峰格式
    关于too many open files解决方案
    mysql 判断区间是否存在交集和并集
    http 请求拼接多个请求参数
    Failed to execute goal org.apache.maven.plugins:maven-surefire-plugin:2.12.4:test (default-test) on project jic-member: There are test failures.
    用dubbo时遇到的一个序列化的坑 xxxServiceImpl must implement java.io.Serializable
    django的分页器
    Django-form组件和ModelForm组件
  • 原文地址:https://www.cnblogs.com/cnJun/p/3715351.html
Copyright © 2011-2022 走看看