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异步刷新局部页面的更多相关文章
- Ajax异步刷新局部页面的小李子
看到下面那幅图没有,我们要的是当点击确定以后,根据条形码搜索出商品信息,并且异步刷新右边页面:
- jQuery实现AJAX定时刷新局部页面实例
本篇文章通过两种方法实例讲解ajax定时刷新局部页面,当然方法有很多种,也可以不使用ajax来刷新页面,可以使用jquery中的append来给指定内容加东西,但是都不太实用,最实用的方法还是ajax ...
- js将 HTML 页面生成 PDF 并下载
最近碰到个需求,需要把当前页面生成 pdf,并下载.弄了几天,自己整理整理,记录下来,我觉得应该会有人需要 :) 先来科普两个插件: html2Canvas 简介 我们可以直接在浏览器端使用html2 ...
- JS定时刷新页面及跳转页面
JS定时刷新页面及跳转页面 Javascript 返回上一页1. Javascript 返回上一页 history.go(-1), 返回两个页面: history.go(-2); 2. history ...
- 局部页面传值Model
1:新建个局部页面,将这里页面的Model数据传递过去,在局部页面进行和一般页面一样的操作就行. 这里和HTML.Action不一样,对于HTML.action来说,它是新建了一个action来进行传 ...
- 常用的js跳转页面方法实现汇总
1.window.location.href方式 <script language="javascript" type="text/javascript" ...
- js和jquery页面初始化加载函数的方法及先后顺序
运行下面代码.弹出A.B.C.D.E的顺序:A=B=C>D=E. jquery:等待页面加载完数据,以及页面部分元素(不包括图片.视频), js:是页面全部加载完成才执行初始化加载. <! ...
- js关闭当前页面(窗口)的几种方式总结(转)
js关闭当前页面(窗口)的几种方式总结 1. 不带任何提示关闭窗口的js代码 代码如下 <a href="javascript:window.opener=null;windo ...
- atitit. js 跨界面 页面 web cs 传值方法总结
atitit. js 跨界面 页面 web cs 传值方法总结 #--需求 js #---两个方法: 直接传跟跟间接传递... 1.直接传跟new form(param) web使用url方 ...
随机推荐
- 超详细的Web前端开发规范文档
规范目的为提高团队协作效率, 便于后台人员添加功能及前端后期优化维护, 输出高质量的文档, 特制订此文档. 本规范文档一经确认, 前端开发人员必须按本文档规范进行前台页面开发. 本文档如有不对或者不合 ...
- 启动apache 提示Starting httpd: AH00558
Starting httpd: AH00558: httpd: Could not reliably determine the server's fully qualified domain nam ...
- caffe源码阅读(1)_整体框架和简介(摘录)
原文链接:https://www.zhihu.com/question/27982282 1.Caffe代码层次.回答里面有人说熟悉Blob,Layer,Net,Solver这样的几大类,我比较赞同. ...
- STM32F103X datasheet学习笔记---GPIOs and AFIOs
1.前言 每个GPIO端口有如下几个寄存器进行操作: 两个32位配置寄存器:GPIOx_CRL, GPIOx_CRH 两个32位数据寄存器:GPIOx_IDR, GPIOx_ODR 一个32位set/ ...
- flask_restplus(1)- 未完成
快速开始 本指南假设您对Flask有一定的了解,并且您已经安装了Flask和Flask- restplus.如果没有,则按照安装部分中的步骤操作. 初始化 与其他所有扩展一样,您可以使用应用程序对象初 ...
- ES系列十九、kibana基本查询、可视化、仪表盘用法
一. 定义索引模式匹配 1.前缀模糊匹配,一个模式匹配多个索引 每一个数据集导入到Elasticsearch后会有一个索引匹配模式,在上段内容莎士比亚数据集有一个索引名称为shakespeare,账户 ...
- maven名词解释
Maven名词解释 Project:任何你想build的事物,Maven都可以认为它们是工程.这些工程被定义为工程对象模型(POM,Poject Object Model).一个工程可以依赖其它的工程 ...
- git安装及基础用法
1.安装GitGit-2.9.3-64-bit.exe 2.打开Git Bash,设置用户名,Email $ git config --global user.name "Your Name ...
- tomcat jetty
背景 其实这个比较毫无意义.只是当时突然知道了jetty,所以记下来,对于开发人员来说选择哪个一般意义不大. 转载 从架构上来看 Tomcat 在处理少数非常繁忙的连接上更有优势,也就是说连接的生命周 ...
- linux windows 传输文件
其中两种方式,当然,只是我自己试验的两个,其实还有别的方法,但是我也懒得实践了. 1 pscp c:\abc.sql root@192.168.1.1:/home/person/hww 2 Lrz ...