最近需要做一个在网页中要不断检测服务器端数据程序,当然最简单的方法是在html页面头部加以下标签
<META http-equiv=V="REFRESH" content="5;URL=本页面url">
实现将网页设成每隔5秒钟将自身页面刷新一次;从而检测或加载服务器端数据.
但该方法有一个不雅的问题是,页面要不停地闪烁刷新,而且在每次刷新时都会发出windows点击链接的声音.如果时间久了,没有人能忍受的了吧.
现在找到了AJAX(异步 JavaScript 和 XML)这个技术,他可以帮我们解决客户端无需提交页面即可发送对服务器的请求,这些均通过客户端javascript实现,以下为实现代码:
第一部分:
<body onload="checknew()">
页面加载时即开始调用脚本checknew.
第二部分:页面脚本
//页面声明对象
var http_request;
function checknew()
{
http_request = false;
//下面需要建立一个XMLHttpRequest对象,用它进行服务器请求,针对不同浏览器建立方法不同
if (window.XMLHttpRequest)
{ // Mozilla, Safari,...
http_request = new XMLHttpRequest();
if (http_request.overrideMimeType)
{
http_request.overrideMimeType('text/xml');
}
}
else if (window.ActiveXObject)
{ // IE
try {
http_request = new ActiveXObject("Msxml2.XMLHTTP");
}
catch (e)
{
try
{
http_request = new ActiveXObject("Microsoft.XMLHTTP");
}
catch (e) {}
}
}
if (!http_request) {
alert('出现错误,不能建立一个XMLHTTP实例!');
return false;
}
//funccallback为请求返回后要调用的javascript方法
http_request.onreadystatechange = funccallback;
//该请求用get方式发送至url为/servlet/CheckServlet的Servlet,url可以带参数或数据方式同一般url传值,Servlet请看后面代码
http_request.open('GET',url, true);
http_request.send(null);
//如果要使用HTTP POST方式,必须要对 XMLHttpRequest 对象设置一个 Content-Type 头,使用以下语句(url中也可包含参数):
//http_request.open('POST',url, true);
//http_request.setRequestHeader("Content-Type", "application/x-www-form-urlencoded");
//http_request.send("这里为传的参数");
//每隔5秒循环一次服务器请求
setTimeout('checknew()',5000);
}
//请求返回后调用方法
function funccallback()
{
//检测请求状态http_request.readyState有以下几种状态 0 (未初始化) 1 (正在装载) 2 (装载完毕) 3 (交互中) 4 (完成)
if (http_request.readyState == 4)
{
//XMLHttpRequest的status属性被测试用来确定请求是否成功完成。当处理简单的GET与POST请求,你可以认为只要不是200(OK)的状态就表示发生了错误。
if (http_request.status == 200)
{
//http_request.responseText为服务器返回的文本内容,可自行做各种处理
alert(http_request.responseText);
}
else
{
alert('对不起,请求出现错误!');
}
}
}
//第三部分 ,java Servlet的代码:
首先在web.xml中配置web Servlet,如下:
<servlet>
<servlet-name>CheckServlet</servlet-name>
<servlet-class>com.view.CheckServlet</servlet-class>
</servlet>
<servlet-mapping>
<servlet-name>CheckServlet</servlet-name>
<url-pattern>/servlet/CheckServlet</url-pattern>
</servlet-mapping>
下面为Servlet实例:
package com.view;
//导入包略去,可在ide中自动导入(以下代码包含部分ide自动生成代码,可略去)
public class CheckServlet extends HttpServlet
{
public void destroy()
{
super.destroy();
// Just puts "destroy" string in log
// Put your code here
}
public void doGet(HttpServletRequest request, HttpServletResponse response)
throws ServletException, IOException
{
//用get方式发送请求,因此在此处理,
response.setContentType("text/xml");
response.setHeader("Cache-Control", "no-cache");
String ids="hello,China!";
//将ids返回给客户端
response.getWriter().write(ids);
}
public void doPost(HttpServletRequest request, HttpServletResponse response)
throws ServletException, IOException
{
//如果用post方式请求,则在此处理
}
public void init() throws ServletException
{
// Put your code here
}
//以上代码,均测试成功,相信朋友们一看就懂,错误之处,敬请指教!
//全文完
分享到:
相关推荐
在这个"Ajax+servlet实现搜索框智能提示"的主题中,我们将探讨如何利用Ajax技术和Servlet来创建一个实时、动态的搜索框,提供智能的用户输入建议。 首先,让我们了解Ajax的基本原理。Ajax的核心是XMLHttpRequest...
Ajax(Asynchronous JavaScript and XML)技术是现代Web开发中的关键组成部分,它允许在不刷新整个页面的情况下与服务器进行异步数据交互。Servlet是Java Web开发中的一个标准,用于处理和响应HTTP请求。在这个实例...
在登录和修改场景中,AJAX可以发送异步请求到Servlet,获取验证结果,然后无刷新地更新页面显示。这避免了传统的表单提交方式,即页面必须完全刷新才能显示反馈信息,提高了用户体验。 具体实现上,JavaScript...
在本项目中,"Ajax+Servlet+Jsp实现页面无刷新查询学生成绩系统",主要涉及了四个关键技术和概念:Ajax、Servlet、JavaScript(JS)以及JavaServer Pages(JSP)。下面将对这些技术及其在项目中的应用进行详细解释。...
"Ajax + Servlet" 分页技术是结合了异步JavaScript和XML(Ajax)与Java Servlet技术来实现在不刷新整个页面的情况下动态加载分页内容。本文将深入探讨这种技术的实现原理和步骤。 首先,让我们理解Ajax的核心概念。...
在IT领域,构建Web应用程序是常见的任务之一,而本示例提供了一个基于JSP、JavaBean、Servlet、Ajax以及Mysql的完整应用实例,主要涵盖了数据的增删查改(CRUD)操作,并且利用Ajax实现了异步的验证码验证功能。...
在Java Web开发中,"Ajax + Servlet 实现搜索提示列表效果"是一个常见的需求,它能够提升用户在输入查询时的体验。Ajax(Asynchronous JavaScript and XML)是一种在无需重新加载整个网页的情况下,能够更新部分网页...
总的来说,`jQuery`简化了前端的JavaScript编程,`Ajax`提供了无刷新的交互体验,`JSON`作为数据交换格式提高了效率,而`Servlet`则负责后台的处理和逻辑控制。这四者结合,能够构建出高效、交互性强的Web应用。在...
3. **Servlet**:Servlet是Java编程语言中的一个接口,由Java Web服务器实现,用于处理来自客户端(如浏览器)的请求并生成响应。在本项目中,Servlet接收来自Ajax的请求,执行查询操作,并将查询结果封装成JSON格式...
5. **客户端接收**:前端JavaScript的Ajax回调函数接收到服务器的响应,解析JSON数据,然后更新DOM(Document Object Model),使得页面局部刷新。 博客链接(https://lzj0470.iteye.com/blog/368021)可能会提供一...
在Ajax应用中,Servlet通常用于接收客户端发送的Ajax请求,处理数据,然后返回JSON格式的响应。Servlet生命周期包括加载、初始化、服务、销毁等阶段,可以处理HTTP请求,并通过Response对象将结果回传给客户端。 **...
Servlet是Java服务器端的组件,它处理来自客户端(如浏览器)的请求并返回响应。在登录场景中,Servlet接收Ajax发送过来的用户名和密码,进行身份验证。通常,这会涉及到数据库查询,比如检查用户名是否存在,以及...
【标题】:“Ajax + Servlet + JSP 实现WebQQ” 【描述】:此项目是基于Ajax、Servlet和JSP技术实现的一个网页版QQ应用。它旨在提供与原版QQ相似的功能,让用户能够在网页上进行即时通讯,无需安装任何客户端软件。...
在IT行业中,Ajax(Asynchronous JavaScript and XML)技术是一种用于创建快速、动态网页的重要...这样的实现方式不仅提供了无刷新的用户体验,还能避免因完整页面刷新带来的性能损耗,提升了下载功能的效率和易用性。
总结来说,"AJAX+JSP+Servlet网络版俄罗斯方块"项目利用了AJAX进行无刷新的数据交互,JSP呈现动态界面,Servlet处理后端逻辑,共同构建了一个实时、互动的在线游戏环境。这种技术组合展示了Web开发中的高效协作,为...
【标题】"jsp+servlet+ajax+easyui学生管理系统"是一个典型的Web应用程序开发实例,它结合了多种技术来实现一个高效、用户友好的学生管理平台。这个项目对于初学者来说是一个很好的起点,可以帮助他们理解如何在实际...
### 使用JS + JSP + Servlet 实现网页局部刷新的关键知识点 在现代Web开发中,提升用户体验的一个重要方式是实现页面的局部刷新。这种方式允许开发者在不重新加载整个页面的情况下更新部分数据,从而使得用户能够...
Ajax使得页面无刷新更新成为可能,jQuery简化了JavaScript代码,Servlet作为Java后端处理逻辑,JSON提供了高效的数据交换方式,而JSP则可能用于构建动态页面结构。这个实例对于学习和理解Web开发中的数据交互流程...
通过以上步骤,我们可以在Java Servlet和JSP页面中有效地实现AJAX请求,实现页面的无刷新更新,提升用户的交互体验。在实际开发中,还可以结合现代前端框架如Vue.js、React.js等,进一步优化AJAX请求的处理和页面...
在本项目中,Servlet将作为服务器端的控制器,接收来自Ajax的请求,处理验证逻辑,并返回结果给客户端。 实现步骤如下: 1. **创建数据库和表**:首先,我们需要在MySQL中创建一个数据库,例如“registration”,...