您的位置：首页 > 其它

完成页面的定时跳转

2018-01-21 17:06 162 查看

1 使用js完成页面的定时跳转

<!DOCTYPE html>
<html>

<head>
<meta charset="UTF-8">
<title></title>
<script type="text/javascript" src="js/jquery-2.1.0.js"></script>
<script type="text/javascript">
window.onload = function() {
var i =4;
var eSpan = document.getElementById("second");
time = setInterval(function(){
eSpan.innerHTML=i
--i;
if(i==0){
clearInterval(time);
location.href="http://www.baidu.com";
}
}, 1000);
}
</script>

</head>

<body>
恭喜你注册成功<span id="second" style="color: red;">5</span>中之后跳转， 如果没有跳转点击
<a href="http://www.baidu.com">这里</a>
</body>

</html>

2 设置定时刷新的头

package header;

import java.io.IOException;
import javax.servlet.ServletException;
import javax.servlet.http.HttpServlet;
import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.HttpServletResponse;

public class RefreshServlet extends HttpServlet {

protected void doGet(HttpServletRequest request, HttpServletResponse response)
throws ServletException, IOException {

//设置定时刷新的头 5秒之后跳转到百度
response.setHeader("refresh", "5;url=http://www.baidu.com");

}

protected void doPost(HttpServletRequest request, HttpServletResponse response)
throws ServletException, IOException {
doGet(request, response);
}
}

3 使用jquery完成

<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title></title>
<script type="text/javascript" src="js/jquery-2.1.0.js"></script>
<script type="text/javascript">
var time;
var i=4; //全局变量
$(function(){
time = setInterval("change()",1000);
});
function change(){
$("#second").text(i);
--i;
if(i==0){
clearInterval(time);
location.href="http://www.baidu.com";
}
}
</script>

</head>

<body>
恭喜你注册成功<span id="second" style="color: red;">5</span>中之后跳转， 如果没有跳转点击
<a href="http://www.baidu.com">这里</a>
</body>

</html>

内容来自用户分享和网络整理，不保证内容的准确性，如有侵权内容，可联系管理员处理

标签：

相关文章推荐

新的分享

章节导航