`

Ajax实现不刷屏的前提下实现页面定时刷新

阅读更多

主页面(要求刷新的页面)要求每一分钟刷新一次系统时间

<html>

<body onload="makeRequest("getSystemTime.jsp")"> //创建httpRequest对象

<form name="dateForm">

<table>

<td colspan="2" align="center">
<div id="sysTimeShow"></div>//显示平台系统时间
</td>
</table></form>

</body>

</html>

getSystemTime.jsp//获得系统的当前时间,也就是输出结果的页面

<%@ page language="java" %>
<%@ page contentType="text/html;charset=GB2312" %>
<%@ page import="java.util.Date"%>
<%@ page import="java.sql.Timestamp"%>
<%@ page import="java.io.IOException"%>

<%
Date d = new Date();
Timestamp ts = new Timestamp(d.getTime());
String result = ts.toString().substring(0,16);
out.write(result,0,result.length());
%>

ajax.js

function makeRequest(url) {
http_request = false;
if (window.XMLHttpRequest) {
http_request = new XMLHttpRequest();
if (http_request.overrideMimeType){
http_request.overrideMimeType('text/xml');
}
} else if (window.ActiveXObject) {
try{
http_request = new ActiveXObject("Msxml2.XMLHTTP");
} catch (e) {
try {
http_request = new ActiveXObject("Microsoft.XMLHTTP");
} catch (e) {
}
}
}
if (!http_request) {
alert("您的浏览器不支持当前操作,请使用 IE 5.0 以上版本!");
return false;
}

//定义页面调用的方法init,不是init();没有();
http_request.onreadystatechange = init;
http_request.open('GET', url, true);

//禁止IE缓存
http_request.setRequestHeader("If-Modified-Since","0");

//发送数据
http_request.send(null);

//每60秒刷新一次页面
setTimeout("makeRequest('"+url+"')", 60000);
}

function init() {
if (http_request.readyState == 4) {
if (http_request.status == 0 || http_request.status == 200) {
var result = http_request.responseText;
if(result==""){
result = "系统时间获取失败";
}
document.getElementById ("sysTimeShow").innerHTML="平台系统时间:"+result;
} else {//http_request.status != 200
alert("请求失败!");
}
}
}

分享到:
评论

相关推荐

    Ajax实现不刷屏的前提下实现页面定时刷新(代码)

    本文将深入解析如何利用Ajax技术实现页面的定时刷新功能,重点解读代码实现细节及其工作原理。 ### Ajax技术概述 Ajax是一种用于创建快速动态网页的技术,通过在后台与服务器进行少量数据交换,使网页能够异步更新...

    Ajax实现定时刷新,获取后台数据实现技术

    Ajax(Asynchronous JavaScript and XML)是一种在无需重新加载整个网页的情况下,能够更新部分网页的技术。它通过在后台与服务器交换数据并更新部分网页内容,提高了用户体验,使得网页更加动态和响应迅速。本篇...

    ajax实现定时刷新

    AJAX是一种不重新加载整个页面的情况下更新部分网页的技术。它通过XMLHttpRequest对象与服务器进行异步通信,获取或发送数据,然后使用JavaScript动态地更新DOM(Document Object Model),使用户感受到即时响应的...

    Ajax定时刷新局部页面

    通过以上分析,我们可以看到 Ajax 定时刷新局部页面的核心在于利用 JavaScript 和 XMLHttpRequest 对象实现客户端与服务器之间的异步通信,从而达到局部刷新的效果。这种方式不仅可以提高用户体验,还可以减少服务器...

    jquery实现Ajax定时局部页面刷新

    通过以上步骤,我们可以轻松地使用jQuery和AJAX技术实现页面局部的定时刷新功能。这种方法不仅提高了用户体验,还可以有效减少服务器的压力,因为只需要发送和接收必要的数据,而不是整个页面。此外,开发者还可以...

    使用Ajax实现页面无刷新(局部刷新),

    **Ajax技术详解与实战——实现页面无刷新登录** Ajax(Asynchronous JavaScript and XML)是一种在无需重新加载整个网页的情况下,能够更新部分网页的技术。它的核心是JavaScript对象XMLHttpRequest,通过这个对象...

    Ajax不刷屏实现刷新.txt

    本文将详细介绍如何使用Ajax实现页面的无刷新定时更新功能。 #### 二、基础知识简介 在深入探讨之前,我们先来了解一下相关的基础知识: 1. **Ajax**(Asynchronous JavaScript and XML):一种在无需重新加载整个...

    使用Ajax实现页面表格添删改查的异步刷新操作

    "使用Ajax实现页面表格添删改查的异步刷新操作"是一个实用的技术实现,它允许用户在不刷新整个页面的情况下更新表格内容,从而提高页面响应速度和用户体验。 首先,我们需要理解AJAX的基本原理。AJAX通过JavaScript...

    NET方式下AJax和定时实时刷新技术两种方式实现

    首先,AJAX是Web开发中一种增强用户体验的技术,它允许网页在不重新加载整个页面的情况下与服务器进行数据交换。在.NET环境中,可以利用ASP.NET AJAX库,该库提供了丰富的客户端脚本组件和服务器端控件,简化了AJAX...

    AJAX.NET实现无刷新页面

    这种通信方式使得用户可以在不等待整个页面重新加载的情况下获取并更新信息,提高了网页的响应速度和用户体验。 二、XMLHttpRequest对象 XMLHttpRequest是AJAX的核心,它在后台与服务器进行通信,发送HTTP请求并...

    Ajax刷新 java Ajax 页面刷新

    Ajax(Asynchronous JavaScript and XML)是一种在无需重新加载整个网页的情况下,能够更新部分网页的技术。在Java中,我们可以利用Ajax实现页面的动态刷新,提高用户体验,因为它允许后台与服务器进行异步数据交换...

    Ajax无刷新实现定时更新数据

    为了解决这一问题,Ajax(Asynchronous JavaScript and XML)技术应运而生,它允许网页在不重新加载整个页面的情况下异步地与服务器交换数据并更新部分网页内容,从而实现了网页的无刷新更新。 #### 一、理解Ajax无...

    jQuery+ajax实现局部刷新的两种方法

    本文将介绍使用jQuery和ajax来实现页面局部刷新的两种方法。对于jQuery,它是一个快速、小巧、功能丰富的JavaScript库,通过它可以轻松操作DOM,而ajax允许我们实现无需重新加载整个页面就可以更新网页的部分内容。 ...

    php ajax 实现局部刷新简单例子(超简单化)

    它允许网页在不重新加载整个页面的情况下,通过JavaScript异步地从服务器获取并更新数据。这样,用户可以在页面上进行操作时,感受到更加流畅和即时的响应,增强了用户体验。 ### 实现局部刷新的步骤 接下来,我们...

    jQuery实现AJAX定时刷新局部页面实例

    局部刷新我们讲述到最多的是ajax 了,当然也可以不使用ajax来刷新页面了,我们可以使用jquery中的append来给指定内容加东西了,当然最实用的还是ajax加载数据了。 例子,定时局部刷新 定时局部刷新用到jQuery里面的...

    Ajax页面局部异步刷新技术

    其中,最典型的技术就是Ajax(Asynchronous JavaScript and XML),它可以实现页面局部的异步刷新。 #### XMLHttpRequest对象简介 在给定的示例代码中,我们首先创建了一个`XMLHttpRequest`对象。`XMLHttpRequest`...

    Ajax全新教程 无刷新页面 无刷新数据更新 无刷新绑定 asp.net全新Ajax教程

    例如,一个实时聊天应用,可以通过Ajax实现在不刷新页面的情况下接收到新的消息并显示出来。 **无刷新绑定** 无刷新绑定通常指的是数据绑定技术在Ajax环境下的应用。在ASP.NET中,可以使用Ajax来实现视图(View)...

    thinkphp+ajax无刷新分页

    AJAX是一种在不重新加载整个网页的情况下,能够与服务器交换数据并更新部分网页的技术。它通过在后台与服务器进行少量数据交换,动态地更新页面的部分内容,极大地改善了用户交互体验。 #### 三、ThinkPHP + AJAX无...

    ajax实现局部刷新

    Ajax的核心是JavaScript对象XMLHttpRequest,它允许在不重新加载整个页面的情况下与服务器交换数据并更新部分网页内容。JSP(JavaServer Pages)作为Java的一种动态网页技术,与Ajax相结合可以创建更加高效、互动的...

Global site tag (gtag.js) - Google Analytics