jsp实现本页面刷新

合集下载

js 自动刷新当前页面的方法

js 自动刷新当前页面的方法JS自动刷新当前页面的方法在网页开发中，有时候我们需要实现页面的自动刷新，以便及时更新页面内容或展示动态数据。

而JavaScript提供了一种简单而有效的方法来实现页面的自动刷新。

本文将介绍如何使用JS来实现页面的自动刷新，并提供一些常见应用场景。

1. 使用location.reload()方法进行页面自动刷新最简单的方法是使用location.reload()方法来实现页面的自动刷新。

这个方法会重新加载页面，并刷新所有资源。

我们可以将这个方法放在一个定时器函数中，通过设置定时器的时间间隔来控制刷新的频率。

```javascriptsetInterval(function() {location.reload();}, 5000); // 每5秒刷新一次页面```上述代码中，我们使用了setInterval()函数来创建一个定时器。

定时器函数中的匿名函数会在设定的时间间隔过后执行。

在这个匿名函数中，我们调用了location.reload()方法来重新加载页面。

2. 使用meta标签实现页面自动刷新除了使用JS方法来实现页面的自动刷新，我们还可以使用meta标签来实现相同的效果。

通过在页面的head标签中添加一个meta标签，并设置http-equiv属性为"refresh"，再指定刷新的时间间隔，就可以实现页面的自动刷新。

```html<meta http-equiv="refresh" content="5"> // 每5秒刷新一次页面```在上述代码中，我们将content属性的值设置为5，表示页面将在5秒后自动刷新。

3. 页面自动刷新的应用场景页面的自动刷新在某些特定的应用场景中非常有用。

以下是一些常见的应用场景：3.1 实时数据展示在一些需要展示实时数据的网页中，我们可以使用页面自动刷新来定期更新数据。

JS实现页面跳转与刷新的方法汇总

JS实现页⾯跳转与刷新的⽅法汇总window.location(.href)="URL"其实 .href 可以省略window.location 和window.location.href 实现的效果是⼀样的例如：window.location = ""window.location.href = 上⾯两种⽅法都可以从当前页⾯跳转到⽬标页⾯不同之处在于window.location 返回的是对象，如果没有.href，它会默认参数就是hrefwinodw.location.assign("URL")这个⽅法和上⾯的⽅法差不多⽤法：winodw.location.assign()window.location.replace("URL")如果⽤window.location.replace("") 实现跳转页⾯, 它和上⾯⽅法的区别在于它跳转后不会保存跳出页⾯的信息.所以如果使⽤ history 历史返回按钮是⽆效的它的效果类似于在⽹页上点击右键, 在新窗⼝打开或新标签页打开.⽽window.location.href 实现的效果是在页⾯上点击⽬标链接, 然后可以点击历史返回按钮, 返回到之前页⾯。

历史页跳转下⾯的两种⽅法都可以实现返回历史页，相当于点了页⾯左上⾓的返回按钮window.history.back();window.history.go(-1);back和go⾥⾯都可以放数值例如：⾥⾯放上 -1 意思就是返回上⼀级，⾥⾯放上 -2 就是返回上上级，以此类推⽽且⾥⾯还可以放上指定的路由路径，⽐如window.history.go('../routes/admin/'); 这样可以跳转到指定的路由模块meta refresh如果⽤户浏览器禁⽤了javascript, 那么可以⽤meta refresh来实现⾃动跳转:<noscript><meta http-equiv="refresh" content="0;URL=/"></noscript>如果要实现 JS ⾃动跳转，可以加个定时器：setTimeout(function(){ ... }, 1000);重新加载本页如果你的代码逻辑执⾏完了，想要重新加载页⾯的话，可以⽤这两种⽅法：window.location.reload()window.location.replace()这两种⽅法都可以重新加载本页，但是replace()可以导向另外⼀个URL例如：window.location.replace("")window.navigate('URL')window.navigate('URL')这个⽅法是只针对IE的，不适⽤于⽕狐等其他浏览器，在HTML DOM Window Object中，根本没有列出window.navigate这个⽅法，所以这个⽅法尽量少⽤，遗忘最好。

js自动刷新当前页面的方法

js自动刷新当前页面的方法摘要：1.背景介绍：自动刷新页面的需求2.方法一：使用JavaScript 定时器3.方法二：使用jQuery 的ajax 函数4.方法三：使用HTML5 的HTMLStorage 对象5.总结和建议正文：在网页开发中，我们有时候需要实现自动刷新当前页面的功能。

例如，实时更新数据、定时显示广告等场景。

下面，我们将介绍三种实现自动刷新页面的方法，分别是使用JavaScript 定时器、jQuery 的ajax 函数和HTML5 的HTMLStorage 对象。

方法一：使用JavaScript 定时器这是一种较为简单的实现方式，通过JavaScript 设置一个定时器，每隔一定时间刷新页面。

以下是具体代码示例：```javascriptfunction autoRefresh() {location.reload();}setInterval(autoRefresh, 10000); // 每隔10 秒刷新一次页面```方法二：使用jQuery 的ajax 函数这种方法通过jQuery 的ajax 函数实现异步刷新页面。

在页面加载时，使用ajax 函数请求页面，当收到响应后，使用`location.reload()`刷新页面。

以下是具体代码示例：```javascript$(document).ready(function() {$.ajax({url: location.href,success: function() {location.reload();}});});```方法三：使用HTML5 的HTMLStorage 对象这种方法通过HTML5 的HTMLStorage 对象实现页面刷新。

首先，在页面加载时将当前页面的URL 存储到HTMLStorage 中，然后每隔一定时间，检查URL 是否发生变化。

若发生变化，则执行刷新操作。

以下是具体代码示例：```javascriptfunction checkUrl() {const currentUrl = location.href;const storedUrl = localStorage.getItem("url");if (storedUrl!== currentUrl) {location.reload();localStorage.setItem("url", currentUrl);}}setInterval(checkUrl, 10000); // 每隔10 秒检查一次URL```总结和建议以上三种方法都可以实现自动刷新页面的功能，但具体使用哪种方法取决于实际需求。

JSP Ajax 实现Web页面的局部动态更新

JSP Ajax 实现Web页面的局部动态更新
在浏览网页时，往往因为查看局部信息，而导致整个网页都需要从服务器端重新加载一次。

传统的Web实现方式中，实现类似的效果必须进行整个页面的刷新。

但是借助Ajax技术，可以实现对页面中局部区域的动态刷新，使得用户能够以更好的方式获得最新的数据信息。

本实例演示使用Ajax技术局部动态更新数据。

练习要点：
创建MySQL数据库，名称为test。

数据库中创建表person，表字段信息如表9 -2所示：
创建数据库连接类，打开记事本创建DB.java，代码如下：
现在建立客户端程序。

打开记事本，新建一个名为index5.jsp的页面，代码如
创建一个JSP页面来处理客户端发送的请求，该文件实现删除功能。

打开记事本，新建一个名为index5_server.jsp的文件，代码如下所示：
下面代码判断客户端请求参数，如果不为空，则执行删除操作。

然后从数据库中取出数据，以XML格式返回给客户端。

把本实例部署到Tomcat服务器上后，打开index5.jsp页面，如图9-7所示。

图9-7 局部刷新
单击【删除】，可以看到整个页面并未刷新，只是局部更新。

页面显示如图9-8
所示：
图9-8 删除操作。

页面刷新方法总结JSP刷新

页⾯刷新⽅法总结JSP刷新1) <meta http-equiv="refresh"content="10;url=跳转的页⾯"> 10表⽰间隔10秒刷新⼀次 2) <script language=''javascript''> window.location.reload(true); </script> 如果是你要刷新某⼀个iframe就把window给换成frame的名字或ID号 3) <script language=''javascript''> window.navigate("本页⾯url"); </script> 4) function abc() { window.location.href="/blog/window.location.href"; setTimeout("abc()",10000); } 刷新本页： Response.Write("<script language=javascript>window.location.href=window.location.href;</script>") 刷新⽗页： Response.Write("<script language=javascript>opener.location.href=opener.location.href;</script>") 转到指定页: Response.Write("<script language=javascript>window.location.href='yourpage.aspx';</script>")刷新页⾯实现⽅式总结(HTML,ASP,JS) 'by aloxy 定时刷新： 1，<script>setTimeout("location.href='url'",2000)</script> 说明：url是要刷新的页⾯URL地址 2000是等待时间=2秒， 2，<meta name="Refresh" content="n;url"> 说明： n,是等待的时间，以秒为单位 url是要刷新的页⾯URL地址 3，<%response.redirect url%> 说明：⼀般⽤⼀个url参数或者表单传值判断是否发⽣某个操作，然后利⽤response.redirect 刷新。

jsp返回上一页和刷新

js 返回上一页和刷新1. Javascript 返回上一页history.go(-1), 返回两个页面: history.go(-2);2. history.back().3. window.history.forward()返回下一页4. window.history.go(返回第几页,也可以使用访问过的URL)例:<a href="javascript:history.go(-1);">向上一页</a>response.Write("<script language=javascript>")response.Write("if(!confirm('完成任务?')){history.back();}") response.Write("</script>")response.Write("<script language=javascript>history.go(-1);</script>")<a href="javascript:history.go(-1);">向上一页</a>页面跳转:onclick="window.location.href='list.asp x'"P.S.小技巧(JS引用JS):<script type=text/javascript></script>Javascript刷新页面的几种方法：1 history.go(0)2 location.reload()3 location=location4 location.assign(location)5 document.execCommand('Refresh')6 window.navigate(location)7 location.replace(location)8 document.URL=location.href自动刷新页面的方法:1.页面自动刷新：把如下代码加入<head>区域中<meta http-equiv="refresh" content="20">其中20指每隔20秒刷新一次页面.2.页面自动跳转：把如下代码加入<head>区域中<meta http-equiv="refresh" content="20;url=">其中20指隔20秒后跳转到页面3.页面自动刷新js版<script language="JavaScript">function myrefresh(){window.location.reload();}setTimeout('myrefresh()',1000); //指定1秒刷新一次</script>如何输出刷新父窗口脚本语句1. this.response.write("<script>opener.location.reload();</script>");2. this.response.write("<script>opener.window.location.href =opener.window.location.href;</script>");3. Response.Write("<script language=javascript>opener.window.navigate(''你要刷新的页.asp'');</script>")JS刷新框架的脚本语句 //如何刷新包含该框架的页面用<script language=JavaScript>parent.location.reload();</script>//子窗口刷新父窗口<script language=JavaScript>self.opener.location.reload();</script>( 或<a href="javascript:opener.location.reload()">刷新</a> )//如何刷新另一个框架的页面用<script language=JavaScript>parent.另一FrameID.location.reload();</script>如果想关闭窗口时刷新或者想开窗时刷新的话，在<body>中调用以下语句即可。

jsp实现局部刷新页面、异步加载页面的方法

jsp实现局部刷新页⾯、异步加载页⾯的⽅法
局部刷新页⾯、异步加载页⾯⽅案：
1.在jsp页⾯需要刷新的地⽅增加⼀个控件
<div id=courseList></div>
2.新建⼀个jsp页⾯：aaa.jsp（⽤来放置需要刷新的内容）
3.将id为courseList的dom标签重新赋值为需要的页⾯，就能达到局部刷新的⽬的
$('#courseList').html(msg);
例如：
$.ajax({
dataType:"text",
url:basePath+'/courseList',
data: {
courseBox : types
},success: function(msg){
//列表数据页⾯渲染
$('#courseList').html(msg);
}
});
此处使⽤向后台异步请求数据的⽅式刷新页⾯，后台返回⼀个jsp，来对需要刷新的控件赋值。

@RequestMapping("/courseList")
public String courseList(Model model, HttpServletRequest request) throws Exception {
model.addAttribute("xxx",null);
return "/xxx/xxx/aaa";// 你要跳转的JSP路径
}
以上这篇jsp实现局部刷新页⾯、异步加载页⾯的⽅法就是⼩编分享给⼤家的全部内容了，希望能给⼤家⼀个参考，也希望⼤家多多⽀持。

js页面刷新之实现定时刷新（定时器，meta）

js页⾯刷新之实现定时刷新（定时器，meta）
测试页⾯的代码见
接下来进⼊正题-定时不断刷新页⾯的⽅法：
1.看到定时，很容易想到js的定时器：
1//第⼀种⽅法
2//由于我们已经有了⼀个定时器，所以只要在定时器test中加⼊⼀句刷新页⾯的代码即可
3function test(){
4 h1.style.color = "red";
5 h1.innerText = "我变化了";
6 history.go(0);//可以换成上⼀篇博客的任何⼀种⽅法。

7 }
8 setInterval(test, 1000);
2.通过meta来设置：
1
2
3<meta http-equiv="refresh" content="3">
1
2<!--这种⽅法实现页⾯刷新有点投机取巧，这个标签作⽤是定时跳转，content第⼀个参数表⽰间隔时间，单位为秒，第⼆个参数表⽰⽬标⽹址，但是如果把第⼆个参数设为#，就会实现页⾯刷新。

--> 3<meta http-equiv="refresh" content="3;url=#">
如有错误，请您指正！。

1、下载文档前请自行甄别文档内容的完整性，平台不提供额外的编辑、内容补充、找答案等附加服务。
2、"仅部分预览"的文档,不可在线预览部分如存在完整性等问题,可反馈申请退款(可完整预览的文档不适用该条件!)。
3、如文档侵犯您的权益，请联系客服反馈,我们会尽快为您处理(人工客服工作时间：9:00-18:30)。

</td>
</tr>
</table>
</td>
</form>
</BODY>
</html>
check,jsp (验证页面)：
<%--
/*************************************************************************
* Title: check.jsp *
* @CreateDate 2010/09/01:检查用户注册信息合法性*
* @Author :竹林居者2010/09/01 created *
* *
**************************************************************************/
{
if (ajax.readyState == 4 && ajax.status == 200)
{
//innerHTML是HTML元素的属性，如果您不理解属性那就理解为HTML元素的变量
//ajax.responseText是服务器的返回值，把值赋给id=passport1的元素的属性
//innerHTML这个属性或说这个变量表示一组开始标记和结束标记之间的内容
--%>
<%@ page contentType="text/html; charset=GB2312" %>
<%@ page import="java.io.*" %>
<%@ page import="java.sql.*" %>
<%@ page import="javax.sql.DataSource"%>
<%
String action="";
String groupname="";
//检查用户名
//用作数据库联接，可以根据你的情况修改，如果为测试可以不用*作记号的语句
Connection conn = null;
PreparedStatement pstmt = null;
ResultSet rs = null;
}
catch (E)
{
ajax = false;
}
}
if (!ajax && typeof XMLHttpRequest!='undefined')
{
ajax = new XMLHttpRequest();
}
return ajax;
}
function getMyHTML(serverPage, objID) {
}
//这个函数的作用是当用户的焦点从其他地方回到group_name这个输入框时再给属性赋回原内容
function sl(tx)
{Байду номын сангаас
if(tx=='passport1')
{
document.all[tx].innerHTML = "<div class='reds' align='left'>4-20个字符(包括大小写字母,中文,数字,特殊字符等) 1个汉字等于2个字符，建议使用中文。注册后不可修改。</div>";
try
{
action=request.getParameter("action");
groupname=request.getParameter("groupName").trim();
if("".equals(groupname))
{
System.out.println("null");
out.println("<div class='reds' align='left'>用户名不能为空！</div>");
-->
</style>
<head>
<title>Ajax实例</title>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312">
<style type="text/css">

</style>
</head>
<body bottomMargin="0" leftMargin="0" topMargin="0" rightMargin="0" marginheight="0" marginwidth="0">
if(rs.next())
{
out.println("<div class='reds' align='left'>"+"用户名"+groupname+"已被占用，请重新输入！</div>");
}
else
{
out.println("您的用户名可用");
}
}
}
catch (Exception e){
System.out.println(request.getServletPath()+" error : " + e.getMessage());
jsp+ajax实现无刷新，鼠标离开文本框即验证用户名（本功能多用于注册）
input.jsp(表单提交页面)：
<%@ page contentType="text/html; charset=GBK" %>
<html>
<style type="text/css">
<!--
@import url("../aqgc/style_c.css");
<%@ page import="javax.naming.InitialContext"%>
<%@ page import="java.util.Properties"%>
<%@ page import="java.util.Hashtable"%>
<jsp:useBean id="db" scope="page" class="s2jsp.bysj.dao.BaseDao"></jsp:useBean>
var ajax = GetO();
//得到了一个html元素，在下面给这个元素的属性赋值
var obj = document.all[objID];
//设置请求方法及目标，并且设置为异步提交
ajax.open("post", serverPage, true);
ajax.onreadystatechange = function()
<div id = "passport1" style="color: red"></div>
</td>
<td id="passport2" valign="top"><div class="explain_blue" align='left' ><span class="gray">4-20个字符(包括大小写字母,中文,数字,特殊字符等) 1个汉字等于2个字符，建议使用中文昵称。注册后不可修改。</span></div>
obj.innerHTML = ajax.responseText;
}
}
//发送请求
ajax.send(null);
}
function CheckName()
{
getMyHTML("check.jsp?groupName="+name_form.group_name.value, "passport1");
}
else
{
conn = db.getConn();
String strsql="select userName from USERS where userName='"+groupname+"'";
pstmt = conn.prepareStatement(strsql);
rs = pstmt.executeQuery();
jsp+ajax实现无刷新，鼠标离开文本框即验证用户名
jsp+ajax实现无刷新，鼠标离开文本框即验证用户名（本功能多用于注册）input.jsp(表单提交页面)：%@ page contentType=text/html; charset=GBK % html style type=text/css !-- @import url(../aqgc/style_c.css); --