ajax实现自动刷新页面实例

html部分:

<!DOCTYPE html>
<html lang="en">
<head>
	<meta charset="UTF-8">
	<title>ajax实现自动刷新</title>
</head>
<body onLoad="Autofresh()">
<p>现在的时间是:<span id="currenttime"></span></p>

	<script>
		var xmlobj;
		var count=0;
		function createXMLHttpRequest(){
			if(window.ActiveXObject){
                xmlobj=new ActiveXObject("Microsoft.XMLHTTP");
			}
			else if(window.XMLHttpRequest){
				xmlobj=new XMLHttpRequest();
			}
		}
		function Autofresh(){
			createXMLHttpRequest();
			 count=count+1;
			xmlobj.open("GET","currenttime.php?count="+count,true);
			xmlobj.onreadystatechange=doAjax;
			xmlobj.send("r="+Math.random());//使用随机数处理缓存
		}
		function doAjax(){
			if(xmlobj.readyState==4 && xmlobj.status==200){
				var time_span=document.getElementById(‘currenttime‘);
				time_span.innerHTML=xmlobj.responseText;
				setTimeout("Autofresh()",2000);
			}
		}
	</script>
</body>
</html>

php页面部分

<?php

  $count=$_GET["count"];
  $count=$count%7;
	switch($count){
        case 1: $message = "11111111111111111";break;
        case 2: $message = "22222222222222222";break;
        case 3: $message = "33333333333333333";break;
        case 4: $message = "44444444444444444";break;
        case 5: $message = "55555555555555555";break;
        case 6: $message = "66666666666666666";break;
       
    }       
    $res = $message;
   echo date("Y-m-d H:i:s")."<hr>"."现在的内容是:".$res;

    

  
 ?>

效果图:

时间: 2024-08-06 15:38:10

ajax实现自动刷新页面实例的相关文章

Servlet自动刷新页面

以下内容引用自http://wiki.jikexueyuan.com/project/servlet/auto-refresh.html: 假设一个Web页面,显示了现场比赛得分或股票市场状况或货币兑换率.对于所有这些类型的页面,都需要使用浏览器中的Refresh或Reload按钮来定期刷新Web页面. Java Servlet提供一个机制使这项工作变得简单,可以使得Web页面在给定的时间间隔自动刷新. 刷新一个Web页面最简单的方式是使用响应对象的方法setIntHeader().以下是这种方

ajax+jsp自动刷新

通过 AJAX,JavaScript 可使用 JavaScript 的 XMLHttpRequest 对象来直接与服务器进行通信.通过这个对象, JavaScript 可在不重载页面的情况与 Web 服务器交换数据. AJAX 在浏览器与 Web 服务器之间使用异步数据传输(HTTP 请求),这样就可使网页从服务器请求少量的信息,而不是整个页面. 实验中利用JSP+ajax来实现自动刷新页面,并读/写数据库中的数据. 下面介绍一下利用JSP+ajax来实现局部页面刷新的小例子: 处理ajax请求

gulp+browserSync自动刷新页面

BrowserSync "Browsersync能让浏览器实时.快速响应您的文件更改(html.js.css.sass.less等)并自动刷新页面.更重要的是 Browsersync可以同时在PC.平板.手机等设备下进项调试.您可以想象一下:"假设您的桌子上有pc.ipad.iphone.android等设备,同时打开了您需要调试的页面,当您使用browsersync后,您的任何一次代码保存,以上的设备都会同时显示您的改动".无论您是前端还是后端工程师,使用它将提高您30%的

js自动刷新页面代码

<script language="JavaScript">function myrefresh(){window.location.reload();}setTimeout('myrefresh()',1000); //指定1秒刷新一次</script> 页面自动刷新代码大全1) 自动刷新页面 在 <body> 与 </body> 之间加入: <META http-equiv=refresh content=”10;url=../

Ajax+php实现自动刷新页面

前端代码: <html xmlns="http://www.w3.org/1999/xhtml"> <head> <title></title> <script type="text/javascript"> var xmlHttp; var count = 1; function createXMLHttpRequest() { if (window.ActiveXObject) { xmlHttp =

4.4 创建自动刷新页面

<1>使用Ajax,用户就可以不必反复点击刷新按钮,而实现网页内容的自动刷新 <2>例程采用单击按钮后开始执行,实际中一般以onload事件代替 <3>setTimeout方法,允许以固定的时间间隔(单位为毫秒)执行给定的方法 <4>createRow()方法使用DOM动态创建内容:refreshTime()用于刷新定时器的值 页面代码: <!DOCTYPE html> <html> <head> <meta cha

使用node-livereload自动刷新页面

1. 安装node 2. 安装python 3. 安装connect, serve-static和node-livereload (以下都假设命令行当前目录为e:\WebSite) e:\WebSite>npm install connect e:\WebSite>npm install serve-static e:\WebSite>npm install livereload 如果出现类似:MSB8036: The Windows SDK version 8.1 was not fo

解决Ajax.BeginForm还是刷新页面的问题

在.net mvc中用Ajax.BeginForm来实现异步提交,在Ajax.BeginForm里面还是可以用submit按钮,一般来说 submit按钮是提交整个页面的数据.但是在Ajax.BeginForm里面使用submit,提交的也只是当前Ajax.BeginForm里面的数据.不过在使用这个东西的时候遇到个问题,就是点击submit按钮,也还是刷新页面了,这时突然感觉Ajax.BeginForm就是个没用的东西.后来想想,不对啊,既然能叫Ajax.BeginForm,那么肯定能够局部刷

如何实现自动刷新页面

如果需要自动刷新一个页面,可以用一个简单的HTML实现. <meta http-equiv="refresh" content="10" /> <title>refresh this page every 10 seconds. close this page to stop.</title> <iframe src="http://www.cnblogs.com/bitzhuwei/p/CSharpGL-an-e