看看以下例子你会发现ajax真的好简单
首先准备两个jsp页面
1.index.jsp 代码如下（可直接copy，测试过是通过的）
<%@ page language="java" contentType="text/html; charset=utf-8" import="java.util.*"
pageEncoding="utf-8"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<%
String path = request.getContextPath();
String basePath = request.getScheme()+"://"+request.getServerName()+":"+request.getServerPort()+path+"/";
%>
<html>
<head>
<title></title>
<script language="javascript" >
var httpRequest;
//下面这个函数可以返回一个适合任何浏览器的httpRequest，步子如下：
//1.试着创建一个XMLHttpRequest()示例，该示例可适合于除了微软以外的所有浏览器
//2.增加错误判断，如果当前浏览器是微软的，那么就创建适用于微软的浏览器
//3.但微软的浏览器又有两个版本之分，不过据说微软已经在7.0中增加对XMLHttpRequest()的支持
//4.但这样也需要对原来的浏览器支持，否则你写出来的程序那些用老版本浏览器的用户就是看不到效果的。
function createRequest()
{
try{
httpRequest=new XMLHttpRequest();
}catch(trymicrosoft)
{
try{
httpRequest=new ActiveXObject("Msxml2.XMLHTTP");
}catch(othermicrosoft)
{
try{
httpRequest=new ActiveXObject("Microsoft.XMLHTTP");
}
catch(failed)
{
httpRequest=false;
}
}
}
if(!httpRequest)
{
alert("err Happend!");
return null;
}
return httpRequest;
}
//这个函数就是用户的动作所有触发的函数，如下面的onblur()时，就会调用该函数
//经过的步骤如下：
//1.从HTML页面得到你需要的数据，可以采有document.getElementById("")方法。
//2.建立需要的URL，该URL就和在FORM里面的method为get时并采用submit提交在地址栏里面到的一样
//3.打开与服务器的连接，这里面有三个必要的参数，虽然文档规定只有两个，但是我个人觉得最好用三个，
// 第一个可以是GET,POST或者是POST，但常用的就是前面的两个，并且最好都用大写，因为有些浏览器如FireFox可能会报错，
// 第二个就是打报的URL，这肯定你是必须的。
// 第三个就是下面的看到的true，这里可以是false。true表示同步处理，你提交后可以做其它的事情，
// 这就是AJAX里面的A，即asynchronous;如是false，那就得等到服务器的返回才能够做其它的事情。
//4.等到服务器完成，并且确定返回执行了正确执行的提示，我们就可以做下面我们想做的事情。这些后面的事情就必须通过
// Javascript去完成了，因为XMLHttpRequest的唯一用途就是发送请求及接收服务器的响应结果。
//5.上面都完成了后，就可以采用send()方法向服务器发送你需要发送的信息了，它的参数可以是任何类型，发送的数据格式必须为
// 这样的格式：name=value&anothername=othervalue&so=on，如果你想传送数据，你必须更改MIME类型：
// httpRequest.setRequestHeader('Content-type','application/x-www-form-urnlencoded');
// 否则服务器将会丢弃发送的数据。
function getBackInfo()
{
var username=document.getElementById("username").value;
var url='server.jsp?username='+username;//服务器页面
createRequest();
httpRequest.open("GET",url,"true");
//下面相当于是一个隐性的循环，在函数中规定只有都接收完毕数据后才做处理
//onreadystatechange有5个值：
// 0:未初始化
// 1:初始化
// 2:发送数据
// 3:接收数据中
// 4:数据接收完毕
//另外还要注意就是在注册回调函数onreadystatechange时，后面的函数不能够带参数
//如下disResult是一个函数，不能够带参。
httpRequest.onreadystatechange=disResult;//隐性的循环
httpRequest.send(null);
}
function disResult()
{
//1.一定要确定readystate==4的完成状态才做下面的事，否则会在建立连接即readystate==1的时候就开始，
// 然后会在readystate==2，readystate==3，readystate==4的时候都会执行，不信你可以alert("")一个
// 提示信息试试。
//2.服务器通知完成了，并且还要保证是正确完成的，得到的是我们需要的结果才能够继续，这里常用响应码有：
// 200:成功执行
// 401:未授权
// 403:禁止
// 404:没有找到文件
if(httpRequest.readystate==4)
{
if(httpRequest.status==200)
{
//一切都OK了，那就该用Javascript去执行你想要的动作了。
document.getElementById("disCheckResult").innerHTML=httpRequest.responseText;
alert(document.getElementById("disCheckResult").innerHTML);
}
else
{
alert('Something Wrong has Happend!');
}
}
}
</script>
</head>
<body>
<form>
<table>
<tr>
<td>
<input type=text id="username" onblur="getBackInfo();"/>
</td>
<td id="disCheckResult"> 我会改变！
</td>
<td>
我不会改变！
</td>
</tr>
<tr>
</tr>
</table>
</form>
</body>
</html>
2 服务器处理页面server.jsp(这名字一定要和前面页面设置的服务器页面一样里)
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
<%@ page contentType="text/html;charset=GBK"%>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=GBK"/>
<title>checkUser</title>
</head>
<body>
<%
String username=request.getParameter("username");
if(username.equals("sehan"))//输入sehan则提示存在
out.println("用户名已经存在！");//这个信息就是发送到前台去显示的信息，即服务器返回的信息
else
out.println("可以继续！");
%>
</body>
</html>
分享到：
相关推荐
在描述中提到的"ajax入门例子"可能包括使用Ajax发送请求到服务器获取数据，然后动态地在页面上显示结果。 6. **Servlet**：Servlet是Java EE的一部分，用于扩展服务器的功能。在本项目中，Servlet可能作为控制器，...
在Web开发中，Ajax（Asynchronous JavaScript and XML）技术已经成为创建动态、交互性强的网页应用不可或缺的一部分。Ajax允许页面在不刷新整个页面的情况下与服务器进行数据交换，提升了用户体验。然而，手动编写...
Ajax，即Asynchronous JavaScript and XML（异步JavaScript和XML），是一种在无需重新加载整个网页的情况下，能够更新部分网页的技术。Ajax允许网页与服务器之间进行交互，实现数据的动态加载，提高了用户体验。 在...
一些运行于JSP+Ajax的经典实例，大部分都是在JSP/HTML文件，附有JAVA源代码文件及数据库文件，内有调试说明，例子很多，适合新手朋友练习。这些实例主要有文件上传、无刷新回帖、电子商务应用、动态加载数据、网页...
2. JSP与Servlet交互：可能包含JSP调用Servlet进行业务逻辑处理的例子。 3. 数据库操作：JDBC（Java Database Connectivity）在JSP中的应用，如连接数据库、执行SQL查询等。 4. JSP内置对象的使用：如request、...
接下来，我们将通过一个简单的JSP（Java Server Pages）Ajax实例来进一步阐述： 在本例中，我们有两个JSP页面，一个用于前端展示，另一个用于验证用户是否存在。前端页面（index.jsp）包含一个输入框和一个按钮，当...
程序用Jsp作为客户端，发送异步请求到Servlet，Servlet模拟数据库操作，返回结果，客户端解析，利用JavaScript的dom技术动态创建标签，加以显示。程序内容涵盖ajax基础知识，详细讲解xmlHttpRequest对象，还介绍了...
在这个例子中，`validate.jsp` 是服务器端处理请求的页面，`onreadystatechange` 回调函数会在请求状态变化时被调用，特别是当状态变为 4（完成）且状态码为 200（成功）时，表明数据已从服务器获取并可以处理。...
2. **Ajax请求数据**: 客户端通过Ajax调用包含JSP的URL，发送请求。 3. **服务器响应**: JSP根据请求生成相应数据，返回给客户端。 4. **数据解析**: 客户端接收到数据后，使用JavaScript解析JSON或XML。 5. **更新...
`login.jsp`文件可能是处理Ajax请求的服务器端脚本，例如使用Java Servlet、PHP或其他后端语言编写。 总结来说，这个Ajax注册实例展示了如何使用Ajax实现客户端与服务器的异步通信，以及如何处理用户的注册请求。...
在这个“webwork增删改简单入门例子(+spring+ibatis)”中，我们将探讨如何结合Spring和iBatis这两个流行的技术来构建一个基础的CRUD（创建、读取、更新、删除）应用。 1. WebWork基础知识： - 控制器：WebWork的...
这个"Struts2入门例子"是一个很好的起点，旨在帮助初学者快速理解并掌握Struts2的核心概念和使用方法。 在Struts2框架中，模型（Model）负责业务逻辑，视图（View）处理用户界面，控制器（Controller）则是这两者...
在“dwr入门例子 返回list”这个主题中，我们将深入探讨如何使用DWR从服务器返回列表数据到客户端。列表通常包含多个项目，如数据库查询结果，这些数据可以在网页上以表格或其他形式展示给用户。DWR提供了方便的方法...
**标题：“一个简单的DWR入门例子”** **概述：** Direct Web Remoting (DWR) 是一种开源JavaScript库，它允许在Web浏览器和Java服务器之间进行实时、双向通信，简化了Ajax应用程序的开发。这个入门例子将帮助我们...
这个例子中，当用户在第一个下拉框选择省份时，第二个下拉框会动态填充相应省份的城市。 **Servlet配置**：在`web.xml`文件中，配置了一个名为`SelectCityServlet`的Servlet，用于处理Ajax请求。Servlet映射URL为`...
**AJAX（Asynchronous JavaScript and XML）实例入门** AJAX是一种在无需重新加载整个网页的情况下，能够更新部分网页的技术。这种技术结合了JavaScript、XML、DOM（Document Object Model）、CSS（Cascading Style...
这个“struts2入门级的例子”是一个非常适合初学者的资源，它将引导你了解Struts2的基础知识和核心概念。通过实践这些例子，你可以快速掌握Struts2的使用方法，从而提高你的Web开发技能。 1. **配置环境**: 首先，...
在本项目中，我们探索的是一个使用JSP（JavaServer Pages）、Servlet以及Echarts3的简单入门示例，这是在Eclipse JEE环境下构建的。这个项目旨在帮助开发者理解如何在Web应用程序中集成Echarts3，一个强大的...
最近发现了一个java框架，这个框架已经...这个框架叫dwr，它可以在jsp页面编写js直接调用java的类的方法。原理其实就是它把你的java类发布成了接口服务，js的调用也是ajax的一些封装，有些地方使用这个框架真的很方便。