实验五 AJAX应用
Ajax技术原理及其应用
Ajax技术原理及其应用Ajax技术原理及其应用Ajax技术原理及其应用摘要Ajax技术是目前深受Web用户欢迎的一项技术，它利用JavaScript、DOM、XML和XMLHttpRequest实现客户端与服务器的异步交互，达到很好的用户体验。
文中介绍的选课系统运用Ajax技术，提高了系统的运行效率。
关键词 Ajax技术；Web服务器；XMLHttpRequest；选课系统1 引言在传统的Web应用中，大部分用户动作会触发一个连接到Web 服务器的HTTP请求，服务器收到请求后要完成诸如验证合法性、计算数据、访问数据库等处理工作，最后返回一个HTTP页面到客户端，这个过程中用户一直处于等待状态。
随着Web技术的广泛应用，人们对Web应用程序提出了更高的要求，Web不再简单应用于发布网站，而是成为许多业务处理平台，于是人们更加注重流畅、快捷、人性化的用户体验，为了满足这一需求，一种新的技术出现了，它就是Ajax，它使Web应用程序继承了桌面应用程序反应灵敏、胖客户端、客户体验优秀等优点。
2 Ajax的工作原理2.1 Ajax工作方式Ajax(Asynchronous JavaScript and XML)技术实际上是在客户端和服务器之间加入一个Ajax引擎，它允许采用异步的方式实现客户端与服务器的交互，所以用户不用打开空白窗口等待服务器的响应，而可以继续进行客户端的其它工作。
服务器响应完毕之后，将结果提交给Ajax引擎，Ajax引擎使用HTML和CSS技术展示给用户。
客户端和服务器的这种异步通信，使用户感觉不到客户端与服务器的通信，使得Web程序看起来是即时响应的。
图1显示了Ajax的工作方式。
图1 Ajax的工作方式在传统的Web应用中，客户端只是通过浏览器简单的显示内容，所有的信息都保存在服务器上，引入Ajax后，它把一部分Web应用程序移到了浏览器中，使浏览器中不再是纯粹的`内容。
用户登录时，浏览器会从服务器下载大量代码，这些代码具有一定的处理用户请求的能力，由它们来决定是否将用户的请求提交给服务器。
AJAX局部刷新技术在网络考试系统中的应用
一
、
早期 网络考试 系统 存在 的 问题
务 器接 收到用 户 的请 求 后依 据其 内容 和要 求 ．进行 相 Ｘ Ｈ ｔＲ ｑ ｅｔ 象 负 责 响 应 Ｈｒ 传 送 的 数 ＭＬ ｔ ｅ ｕ ｓ 对 ｐ Ｉ 耶 应 的数据 处 理并 会 向浏 览 器 端 用 户反 馈 处 理 的结 果 。 据 ， 数据 一旦 返 回至客 户 浏览器 端 就立 即用 Ｄ Ｍ 将数 Ｏ 浏 览器 由于工作 于不 记 录状 态 的方 式 ．所 以如果 我 们 据 显示 到 网页上 。 虽然 从 ” ＭＬ ｔ Ｒ ｑ ｅｔ字 面意思 Ｘ Ｈｔ ｅｕｓ ｐ ” 刷 新 了当前 的页面 ．那 么浏 览器 原 先获 取 的信 息会 将 建 议需 使 用 Ｘ ＭＬ格 式 的数 据 ． 而实 际 上利 用 Ｘ － 然 ＭＬ 丢失 ， 因而须 再 次访 问服务 器 取得 所 有需 要 的信息 。 于 Ｈ ｔＲ ｑ ｅｔ ｔ ｅ ｕ ｓ 对象传 送 的数 据 可 以是 任意 格式 的。 ｐ 是 大量 的数 据在 浏览 器和 服务 器 往返 之 间就 会 占用过 ３Ｃ Ｓ ．Ｓ
阐述 了如何 利 用 Ａ Ａ 的局 部刷 新技 术 有效 减 少 页面频繁 重 栽 时传 送 的数 据 量 ．减 少 页面重栽 等待 时 间 ３Ｘ 和服务 器的 负担 ， 而提 高 了考 试 系统 的整体性 能 。 从
ajax 接口案例
ajax 接口案例
当谈到AJAX接口案例时，我们可以举一个简单的例子来说明AJAX是如何工作的。
假设我们有一个网页，上面有一个按钮，当用户点击该按钮时，页面会通过AJAX请求从服务器获取一些数据并将其显示在页面上。
这个过程中涉及到前端页面的事件监听、AJAX请求的发送和服务器的响应处理。
首先，我们需要在页面上编写一个按钮，并添加一个点击事件监听器。
当用户点击按钮时，事件监听器会触发一个JavaScript函数。
接着，在JavaScript函数中，我们会创建一个XMLHttpRequest对象，用它来发送AJAX请求。
我们需要指定请求的URL、请求的类型（GET或POST）、以及是否需要发送一些数据给服务器。
在这个例子中，我们可以发送一个GET请求到服务器的某个接口，以获取数据。
当服务器收到请求后，它会处理请求并返回相应的数据。
在前端页面中，我们需要编写代码来处理服务器的响应。
这通常涉及到对返回的数据进行解析，并将解析后的数据显示在页面上。
总的来说，这个简单的例子涵盖了AJAX请求的发送和服务器响应的处理。
当用户点击按钮时，页面通过AJAX请求获取数据，然后将数据展示在页面上。
这个例子展示了AJAX的核心概念和基本工作原理。
除了这个简单的例子，实际的AJAX接口案例可能涉及到更复杂的数据交互、错误处理、安全性考虑等方面。
不同的网站和应用会有不同的AJAX接口设计和使用方式，但核心的工作原理是类似的。
通过AJAX，前端页面可以与服务器进行异步数据交互，从而实现更加动态和交互性的用户体验。
javaAjax的应用
javaAjax的应⽤⼀.Ajax的使⽤步骤 步⼀：创建AJAX异步对象，例如：createAJAX()步⼆：准备发送异步请求，例如：ajax.open(method,url)步三：如果是POST请求的话，⼀定要设置AJAX请求头，例如：ajax.setRequestHeader()如果是GET请求的话，⽆需设置设置AJAX请求头步四：真正发送请求体中的数据到服务器，例如：ajax.send() 步五：AJAX不断的监听服务端响应的状态变化，例如：ajax.onreadystatechange，后⾯写⼀个⽆名处理函数步六：在⽆名处理函数中，获取AJAX的数据后，按照DOM规则，⽤JS语⾔来操作Web页⾯ 分析：⼆.⽤⽤实例（状态的切换）当我们点击图⽚就切换到另⼀种状态，并且图⽚发⽣改变 1.当我们点击图⽚会进⼊到servlet的doGet⽅法public void doGet(HttpServletRequest request, HttpServletResponse response)throws ServletException, IOException {//获取浏览器端的数据String lid=request.getParameter("lid");String isshow=request.getParameter("isshow");LinkService service=new LinkServiceImpl();int flag=1;//1表⽰成功0表⽰失败try{//执⾏修改isshow的值service.updateIsshow(Integer.parseInt(lid), Integer.parseInt(isshow));}catch(Exception e){flag=0;}//返回给浏览器//response.setContentType("text/html");PrintWriter out = response.getWriter();if(flag==1)out.print("1");elseout.print("0");out.close();} 2.调⽤service层的修改⽅法public void updateIsshow(int lid,int isshow) {String sql = "UPDATE Link SET isshow=? WHERE lid=?";Connection conn = JdbcUtil.getConn();PreparedStatement ps = null;try {ps = conn.prepareStatement(sql);ps.setInt(1, isshow==1?0:1);ps.setInt(2, lid);ps.execute();} catch (SQLException e) {e.printStackTrace();}JdbcUtil.closeAll(null, ps, conn);} 3.进⼊页⾯调⽤ajax中的⽅法，并传⼊id和当前状态isshow <script type="text/javascript">//1获取ajax内置对象function createAjax() {var ajax = null;try {ajax = new ActiveXObject("microsoft.xmlhttp");} catch (e) {ajax = new XMLHttpRequest();}return ajax;}var obAjax = createAjax();var info = "";var vlid = "";function changeIsshow(lid, isshow) {vlid = lid;if (isshow == 1){info = " 不显⽰ <IMG onclick=changeIsshow("+ lid+ ",0) border=0 align=absMiddle src=../images/edit.gif width=14 height=14>";}else{info = " 显⽰ <IMG onclick=changeIsshow("+ lid+ ",1) border=0 align=absMiddle src=../images/XiuGai.gif width=14 height=14>";}//2 准备发送异步请求 method请求⽅式 get,post, 请求地址 urlvar url = "LinkChangeServlet?lid=" + lid + "&isshow=" + isshow+ "&dates="+new Date(); obAjax.open("get", url);//4发送请求体中的数据obAjax.send(null);//5监听状态obAjax.onreadystatechange = function (){//a 服务器是否正确接收数据 readyState ==4if (obAjax.readyState == 4) {//b 服务器是否正确返回数据给浏览器status==200if (obAjax.status == 200) {//接收服务器返回的数据,reponseText返回changeCity.jsp中out.println()中的所有⽂本信息 var riceive = obAjax.responseText;if (riceive == 1) {document.getElementById("isshowInfo" + vlid).innerHTML = info;} else {alert('修改失败');}}}};}</script>//jquery当中的ajax<script src="../js/jquery.js" ></script><script>function changeIsshowTwo(lid, isshow){if (isshow == 1){info = " 不显⽰ <IMG onclick=changeIsshowTwo("+ lid+ ",0) border=0 align=absMiddle src=../images/edit.gif width=14 height=14>";}else{info = " 显⽰ <IMG onclick=changeIsshowTwo("+ lid+ ",1) border=0 align=absMiddle src=../images/XiuGai.gif width=14 height=14>";}//调⽤jquery的ajax中的get⽅式var url = "LinkChangeServlet?lid=" + lid + "&isshow=" + isshow+ "&dates="+new Date();$.get(url,null,function(data){if(data==1){$("#isshowInfo"+lid).html( info );}else{alert('失败');}});}</script> 4.赋值<div id="isshowInfo${link.lid}">${link.isshow==0?"不显⽰":"显⽰"}<IMG onclick="changeIsshowTwo(${link.lid},${link.isshow})"border=0 align=absMiddlesrc=${link.isshow==0?"../images/edit.gif":"../images/XiuGai.gif"} width=14 height=14> </div>原始状态如下图改变之后的状态如下图总结：XMLHttpRequest(即：AJAX)对象常⽤事件，⽅法和属性（1）事件：ajax.onreadystatechange：表⽰AJAX异步对象不断监听服务端的响应，是由服务器程序触发，不是程序员触发（2）属性：ajax.readyState==0：表⽰AJAX异步对象已创建好，但还没有调⽤open()⽅法ajax.readyState==1：表⽰AJAX异步对象已调⽤open()⽅法，但还没有调⽤send()⽅法ajax.readyState==2：表⽰AJAX异步对象已调⽤send()⽅法，但请求还没有到达服务器端ajax.readyState==3：表⽰服务端已接收到AJAX异步对象的请求，正在处理响应中。
Ajax技术应用
null 作为该方法的参数即可：
2.4 设置回调函数
由于是异步请求，请求发出后JavaScript 方法不会等
待服务器处理完成，因此代码将继续执行，就是说，
将退出该方法而把控制返回给表单。用户可以继续输 入信息，应用程序不会等待服务器。
当服务器完成请求之后，需要指定该如何处理响应。
XMLHttpRequest对象的onreadystatechange属性 允许指定一个回调函数反向调用Web页面中的代码。
如果全部失败，则保证request的值仍然为false
检查request是否仍然为false（如果一切顺利就不会是false） 如果出现问题则使用JavaScript警告通知用户出现了问题
2.2建立到服务器的请求
准备好XMLHttpRequest对象，就可以建立到服务器
的请求了。
首先结合一些表单中的数据来构造URL：
传统Web应用与Ajax应用的比较
Ajax应用通过在用户和服务器之间引入一个媒介（Ajax engine）来异步发送请求，消除了传统的发送请求－等待－
发送请求－等待的特性，极大的提高了用户体验。
传统Web应用与Ajax应用的比较
异步请求不等待服务器响应。发送请求后应用程序 继续运行。用户仍然可以在Web表单中输入数据，
2.4 设置回调函数（续）
需要特别注意的是该属性在代码中设置的位置 —— 它是在调用send() 之前设置的。发送请求之前必须设置该属性，这样服务器在回答完成请 求之后能够查看该属性！ 注意，这里updatePage是个函数名称，不能写成updatePage() 函数调 用的形式！这表示将updatePage()函数运行的返回结果赋值给
跟我学AJAX(异步JavaScript和XML)应用技术——体验应用AJAX技术的应用效果
把地图向右拖动 - 就能看见地图在滚动
在字典 输入单词，点击提交，参 开始输入单词，边输入边看到匹配单词，输入结束看到 里查单 看单词的定义 单词定义
杨教授大学堂，版权所有，盗版必究。 2/11 页
杨教授大学堂 精心创作的优秀程序员 职业提升必读系列资料
词 在线论 输入消息，提交，点击 " 坛交互 查看新消息" 输入消息，如果有新的回复会自动出现
杨教授大学堂 精心创作的优秀程序员 职业提升必读系列资料
1.1 跟我学 AJAX （异步 JavaScript 和 XML） 应用技术——体验应用 AJAX 技术的应用效果
1.1.1 体验应用 AJAX 技术的应用效果 1、Google Maps 站点 在 Google Maps 站 点 (/ 或 者 ，
填写很 访问一个向导的多个页 当你输入完一个字段立即得到错误消息，填写过程中动 多字段 面， 得到多个错误字段信 态的改变数据(例如你填写完 zip 码，地址上自动填写上 的表单 息 地区)，而不用等待页面刷新
2、Google Suggest 站点 再 例 如 ， 在 一 个 Ajax 驱 动 的 页 面 中 ， 例 如 Google Suggest 站 点 (/webhp?complete=1&hl=en)，当我们在搜索域中输入内容时，每一个字符 就会被异步地传送到服务器端-------从外观看上去，当我们输入数据时，单词就会快速地出 现在文本域中。
/)中，我们可以点击地图，放大，缩小并且根据我们浏览的需要来回拖 动地图。
该网站似乎跟同类的其它的网站没有太大区别。不过，一旦我们输入了某个地址，这 个网站马上带你进入一个城市，穿越一条又一条街道，而在此过程中我们会发觉事情非常 美妙。 首先，我们不会见到沙漏图标------网页会无缝地一下子转换到新的一页，我们的电脑 在等待下载更多数据时，屏幕不会出现任何间断。
Ajax实战(Ajax in action中文版)
1.Ajax实战(Ajax in action中文版)1.1 为什么需要Ajax富客户端？建造一个富客户端[2]毫无疑问要比设计一个网页复杂。
付出这些额外的努力，动机何在？需要付出什么代价？而且……等一下，富客户端到底是什么？富客户端的两个要点是：第一，它是“富”的；第二，它是“客户端”。
这好像是一句废话，别急，待我稍作解释。
“富”是指客户端的交互模型，要有多样化的输入方式和符合直觉的及时反馈手段。
说简单点儿，一个“富”的应用使用起来应该像是在使用现在的桌面应用一样，例如，就像是使用字处理软件（Word）或电子表格软件（Excel）。
接下来，我们有必要仔细地考察一下所要涉及的各个方面。
1.1.1 比较用户体验花几分钟使用一下你选中的应用（浏览器除外），记下它用到了哪些用户交互，然后马上回来。
为了简短起见，我举一个电子表格的例子，但是，这里所涉及的要点是通用的，足以针对文本编辑器上的各种情形。
好，我们开始。
先在电子表格中随便输入几个等式，注意到，可以以几种方式进行交互：编辑数据，用键盘和鼠标浏览数据，还可以使用鼠标拖拽来重新组织数据。
我做这些操作的时候，程序给了我反馈。
移动鼠标的时候，光标改变了形状；当鼠标停在上面的时候，按钮变亮了；选中的文字也改变了颜色。
窗口或者对话框被选中的时候，也和平常显得不一样了，等等（图1-1）。
这些就是所谓“富”的交互。
当然了，仍然有一些有待改进的地方，但这是一个好的开始。
OK，电子表格就是一个富客户端程序了吗？当然不是。
在电子表格或者类似的桌面应用中，业务逻辑和数据模型是在一个封闭的环境中运行的。
在这个环境中，它们彼此清晰地了解对方，并且可以互相访问，而环境之外的东西，对于它们来说是未知的（图1-2）。
那么客户端又是什么呢？它是与另一个独立的进程相互通信的程序，后者通常运行在服务器上。
一般来说，服务器总是要比客户端大一些，能力强一些，配置更好一些，因为在服务器上通常要存储浩如烟海的信息。
AJAX实验报告
《Ajax课程》实验报告班级：信管B1201学号：学生姓名：实验地点：日期：2015-3-12实验项目(一)：XMLHttpRequest对象实验1.实验内容1．验证课本P181状态栏跑马灯效果。
【将运行结果截图】2．简单Java Applets程序的编写。
【将运行结果截图】3．验证课本P167横幅广告特效。
【将运行结果截图】4．验证附加练习水中倒影特效。
【将运行结果截图】2.实验目的1．掌握JavaScript的特效设置。
2．掌握Java Applets在网页中的应用。
3．掌握内置对象和浏览器对象使用方法。
3.实验要求1．通过对JavaScript基本语句的了解能够实现一些特效效果。
2．通过对Java Applets小程序的掌握能够实现广告横幅效果的实现。
3．通过对Java Applets小程序的掌握能够实现水中倒影效果的实现。
4.程序清单跑马灯效果 <html><body onload="javascript:Scroll()"><script language="JavaScript">today=new Date();var day,date;if( today.getDay()==0)day="星期日";if( today.getDay()==1)day="星期一";if( today.getDay()==2)day="星期二";if( today.getDay()==3)day="星期三";if( today.getDay()==4)day="星期四";if( today.getDay()==5)day="星期五";if( today.getDay()==6)day="星期六";date="今天是"+(today.getYear())+"年"+(today.getMonth()+1)+"月"+today.getDate()+"日"+day+""; document.write(date);var info="欢迎光临我的网站！"; var interval = 1222;sin = 0; function Scroll() { len = info.length; window.status =info.substring(0, sin+1); sin++; if (sin >= len) sin = 0; window.setTimeout("Scroll();", interval); } </script></body></html>Java Applets程序<HTML> <HEAD> <TITLE>动态显示按鈕</TITLE> </HEAD><BODY BACKGROUND="images/bear_3.jpg"><APPLET CODE="fphover.class" CODEBASE="applet/" WIDTH="170" HEIGHT="24"><PARAM NAME="text" VALUE="趴趴熊官方站 (英文版)"> <PARAM NAME="url" VALUETYPE="ref" VALUE="http://www.ingram.co.jp/inter/suama/suama.html"><PARAM NAME="font" VALUE="Helvetica"><PARAM NAME="fontstyle" VALUE="regular"><PARAM NAME="fontsize" VALUE="16"><PARAM NAME="color" VALUE="#FFFF00"><PARAM NAME="textcolor" VALUE="#FF0000"><PARAM NAME="hovercolor" VALUE="#00FF00"><PARAM NAME="effect" VALUE="reverseGlow"></APPLET> </BODY></HTML>横幅广告和水中倒影<div align=center><applet code="fprotate.class" codebase="applet/" width=462 height=60><param name=image1 valuetype=ref value="images/advert_1.gif"><param name=image1 valuetype=ref value="images/advert_1.gif"><param name=image2 valuetype=ref value="images/advert_2.gif"><param name=image3 valuetype=ref value="images/advert_3.gif"><param name=image4 valuetype=ref value="images/advert_4.gif"><param name=image5 valuetype=ref value="images/advert_5.gif"><param name=image6 valuetype=ref value="images/advert_6.gif"><param name=time value=2><param name=url valuetype=ref value=""> <param name=rotatoreffect value=boxin></applet></div><div align=center><applet archive="AnLake.jar" code="AnLake.class" width=280 height=380><param name=credits value="Applet by Fabio Ciucci ()"><param name=regcode value="NO"><param name=reglink value="NO"><param name=regnewframe value="YES"><param name=regframename value="_blank"><param name=statusmsg value="AnLake applet"><param name=res value="1"><param name=image value="a.jpg" ><param name=wavspeed value="30"><param name=perspective value="10"><param name=farwaving value="300"><param name=wind value="10"><param name=windvarval value="5"><param name=windvarmin value="5"><param name=windvarmax value="15"><param name=halfreflect value="NO"><param name=overimgX value="140"><param name=overimgY value="250"><param name=textscroll value="no"><param name=texttype value="zooming"><param name=textvspace value="0"><param name=textminfont value="8"><param name=textmaxfont value="172"><param name=textoffset value="240"><param name=textspeed value="2"><param name=textfont value="Helvetica"><param name=textbold value="NO"><param name=textitalic value="NO"><param name=textsize value="24"><param name=textshadow value="YES"><param name=TextColR value="255"><param name=TextColG value="255"><param name=TextColB value="155"><param name=TextSColR value="20"><param name=TextSColG value="20"><param name=TextSColB value="50"><param name=TextJumpAmp value="0"><param name=TextJumpSpd value="0"><param name=TextSineAmp value="0"><param name=TextSineSpd value="0"><param name=TextSineAngle value="0"><param name=memdelay value="1000"><param name=priority value="3"> <param name=MinSYNC value="10">Sorry, your browser doesn't support Java. </applet></div>5.实验结果运行结果如下：跑马灯效果图：Java Applets程序横幅广告和水中倒影6.实验总结通过这次试验，掌握JavaScript的特效设置，掌握Java Applets 在网页中的应用，掌握内置对象和浏览器对象使用方法。
- 1、下载文档前请自行甄别文档内容的完整性，平台不提供额外的编辑、内容补充、找答案等附加服务。
- 2、"仅部分预览"的文档,不可在线预览部分如存在完整性等问题,可反馈申请退款(可完整预览的文档不适用该条件!)。
- 3、如文档侵犯您的权益，请联系客服反馈,我们会尽快为您处理(人工客服工作时间：9:00-18:30)。
import javax.servlet.ServletException; import javax.servlet.http.HttpServlet; import javax.servlet.http.HttpServletRequest; import javax.servlet.http.HttpServletResponse;
response.setHeader("Cache-Control", "no-cache"); // out 对象用于写 JSON 数据 PrintWriter out = response.getWriter(); // 接收页面传递过来的区县编号 String districtid = request.getParameter("qxid");System.out.println(11); // 根据区县编号查询街道信息 String[] result = ht.get(districtid);
} else { $.post("register", { uname : $(this).val() }, function(msg) { if (msg == 1) { $("label:first").text("用户名可用！"); } else { $("label:first").text("用户名已存在！"); } });
request.setCharacterEncoding("GB2312"); String uname = request.getParameter("uname");
PrintWriter out = response.getWriter(); if (uname.equals("jgj")) {// 仅起到测试作用
+ request.getServerName() + ":" + request.getServerPort() + path + "/"; %>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="/1999/xhtml">
@SuppressWarnings("serial") public class Street extends HttpServlet {
public void doGet(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
// 模拟数据库 Hashtable<String, String[]> ht = new Hashtable<String, String[]>(); ht.put("1", new String[] { "清河区 1", "清河区 2", "清河区 3", "清河区 4" }); ht.put("2", new String[] { "清浦区 1", "清浦区 2", "清浦区 3", "清浦区 4" }); ht.put("3", new String[] { "淮阴区 1", "淮阴区 2", "淮阴区 3", "淮阴区 4" }); ht.put("4", new String[] { "开发区 1", "开发区 2", "开发区 3", "开发区 4" }); // 设置编码方式 response.setContentType("text/JSON;charset=utf-8"); response.setCharacterEncoding("utf-8");
} } if ($(this).is("#upass")) {
if ($(this).val() == "") { $(this).nextAll("label").text("密码不能为空！");
} } if ($(this).is("#rupass")) {
if ($(this).val() == "") { $(this).nextAll("label").text("重复不能为空！");
}
.importent { color: #FF0000; font-size: larger;
}
.input { width: 140px; height: 20px;
} </style>
<script src="js/jquery-1.4.2.js" type="text/javascript"></script> <script type="text/javascript"> $(function() { $(".input").focus(function() {
@SuppressWarnings("serial") public class Register extends HttpServlet {
public void doGet(HttpServletRequest request, HttpServletResponse reபைடு நூலகம்ponse) throws ServletException, IOException {
<head> <meta http-equiv="Content-Type" content="text/html; charset=gb2312" /> <title>用户注册</title> <style type="text/css">
.focus { background-color: #FF66FF;
out.println("0"); } else {
out.println("1"); } out.flush(); out.close(); }
public void doPost(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
实验五 Ajax 应用
【实验目的】 1、掌握 jQuery 对 Ajax 方法的支持； 2、掌握 jQuery 处理 Ajax 应用的常用方法； 3、掌握 load、get、getJson、post 等常用方法的应用。 【实验准备】 1、复习教材相关内容； 2、预习本次实验； 【实验内容】 1、实现用户注册时的用户名无刷新校验，效果如图 5-1、5-2 所示。(说明：用.net 实现服务器端代码的提交 jQuery 代码和服务器端代码，用 JSP 实现的提交 jQuery 代码和 servlet 中的代码)
this.doGet(request, response); }
}
register.jsp
<%@ page language="java" import="java.util.*" pageEncoding="GB2312"%> <%
String path = request.getContextPath(); String basePath = request.getScheme() + "://"
/> <span class="importent">*</span> <label class="focus"></label>
</td> </tr> <tr>
<td align="right"> 密码：
</td> <td>
<input type="password" class="input" id="upass" /> <span class="importent">*</span> <label class="focus"></label> </td> </tr> <tr> <td align="right"> 重复密码： </td> <td> <input type="password" class="input" id="rupass" /> <span class="importent">*</span> <label class="focus"></label> </td> </tr> </table> <input type="submit" value="注册" /> <input type="button" id="reset" value="重置" /> </form> </center> </body>