java配合ajax加快发展_配合JAVA的AJAX使用

概要

Ajax是“Asynchronous JavaScript and XML”的简称,即异步的JavaScript和XML。

readyState属性用来返回当前的请求状态,有五个可选值。分别是0到4,每个值的含义如下描述。 0:“未初始化”状态, 表示已经创建一个XMLHttpRequest对象,但是还没有初始化请求对象。 1:“打开”状态,表示已经调用了XMLHttpRequest对象的open()方法,已经准备好向服务器端发送请求。 2:“发送”状态,表示已经调用了XMLHttpRequest对象的send()方法把一个请求发送到服务器端,但是还没有收到服务器的响应。 3:“正在接收”状态,表示已经接收到HTTP响应头的信息,但是消息体部分还没有完全接收。 4:“已加载”状态,表示响应已经被完全接收。

status属性用来返回服务器的响应状态码,例如200表示OK,一切正常;404表示请求的文件没有找到;500表示内部服务器发生错误等。

statusText属性的含义与status属性非常类似,不过statusText用文本的形式表示服务器的响应状态,而status以状态码的形式表示。例如,statusText值为OK时,表示一切正常,对应status为200;值为Not Found表示文件没有找到,对应status为404。

onreadystatechange是一个事件触发器,其值往往是一个JavaScript的函数名。任何一个状态的变化,不管是readyState还是status的变化,都会触发该事件,并调用指定的JavaScript函数。

responseText属性用来接收服务器端返回的文本内容,以一个字符串的形式存在。使用responseText属性可以直接将返回的内容赋值给某一个域的innerHTML值,显示到客户端。

responseXML用来接收服务器的响应,以XML的形式存在,这个对象可以解析为一个DOM对象,进一步使用DOM的API更新客户端页面。

GET方式解析XML的AJAX

js代码:

varxmlHttp;//创建XMLHttpRequest对象

functioncreateXMLHttpRequest() {if (window.ActiveXObject) {//Microsoft

xmlHttp= new ActiveXObject("Microsoft.XMLHTTP");

}else if(window.XMLHttpRequest) {

xmlHttp= newXMLHttpRequest();

}

}functionvalidate() {//创建xmlHttp对象

createXMLHttpRequest();//使用DOM,得到id值是username的域

var username = document.getElementById("username");var url = "ValidateUsernameServlet?username=" +escape(username.value);//向服务器端的 ValidateUsernameServlet发送异步请求

xmlHttp.open("GET", url, true);//当状态有变化的时候,调用callback方法

xmlHttp.onreadystatechange =callback;

xmlHttp.send(null);

}functioncallback() {//当客户端完全接收完服务器的响应后,并且状态为200,也就是正常

if (xmlHttp.readyState == 4) {if (xmlHttp.status == 200) {//使用responseXML属性,接收服务器端返回的的XML文件 ,使用DOM解析XML

//用以下二种方式都可以得到页面上的值

//var message = xmlHttp.responseXML.getElementsByTagName("message")[0].firstChild.data;

var message = xmlHttp.responseXML.getElementsByTagName("message")[0].childNodes[0].nodeValuevar passed = xmlHttp.responseXML.getElementsByTagName("passed")[0].firstChild.data;

setMessage(message, passed);

}

}

}functionsetMessage(message, passed) {//使用DOM得到id值为usernamemsg的域,用来显示提示信息

var validateMessage = document.getElementById("usernamemsg");var fontColor = "red";if (passed == "true") {

fontColor= "green";

}

validateMessage.innerHTML= "" +message+ " ";

}

servlet代码:

public class ValidateUsernameServlet extendsHttpServlet {public voiddoGet(HttpServletRequest request, HttpServletResponse response)throwsServletException, IOException {

doPost(request,response);

}public voiddoPost(HttpServletRequest request, HttpServletResponse response)throwsServletException, IOException {

response.setContentType("text/html;charset=utf-8");

request.setCharacterEncoding("utf-8");boolean flag=true;

String message="";//用户名可以使用

boolean e=true;if(e == true){

message="用户名可以使用";

}else{

flag=false;

message="用户名已经存在,请选择使用其他用户名";

}//将校验的结果,以XML格式返回给客户端

response.setContentType("text/xml;charset=utf-8");

PrintWriter out=response.getWriter();//禁止缓存 HTTP1.0中通过Pragma 控制页面缓存,HTTP1.1中启用Cache-Control 来控制页面的缓存与否//参数:no-cache,浏览器和缓存服务器都不应该缓存页面信息;

response.setHeader("Cache-Control","no-cache");

out.println("<?xml version=‘1.0‘ encoding=‘"+"utf-8"+"‘ ?>");

out.println("");

out.println("" + flag + "");

out.println("" + message + "");

out.println("");

out.close();

}

}

html代码根据实际需求编写,这里不做演示。

POST方式解析XML的AJAX

js代码:

var xmlHttp;//创建XMLHttpRequest对象

function createXMLHttpRequest() {if(window.ActiveXObject) {

xmlHttp= new ActiveXObject("Microsoft.XMLHTTP");

}else if(window.XMLHttpRequest) {

xmlHttp= newXMLHttpRequest();

}

}

function validate() {//创建xmlHttp对象

createXMLHttpRequest();//使用DOM,得到id值是username的域

var username = document.getElementById("username");

var url= "ValidateUsernameServlet";//向服务器端的 ValidateUsernameServlet发送异步请求

xmlHttp.open("POST", url, true);

xmlHttp.setRequestHeader("Content-Type","application/x-www-form-urlencoded");//当状态有变化的时候,调用callback方法

xmlHttp.onreadystatechange =callback;

xmlHttp.send("username="+encodeURI(username));

}

function callback() {//当客户端完全接收完服务器的响应后,并且状态为200,也就是正常

if (xmlHttp.readyState == 4) {if (xmlHttp.status == 200) {//使用responseXML属性,接收服务器端返回的的XML文件 ,使用DOM解析XML

var message = xmlHttp.responseXML.getElementsByTagName("message")[0].firstChild.data;

var passed= xmlHttp.responseXML.getElementsByTagName("passed")[0].firstChild.data;

setMessage(message, passed);

}

}

}

function setMessage(message, passed) {//使用DOM得到id值为usernamemsg的域,用来显示提示信息

var validateMessage = document.getElementById("usernamemsg");

var fontColor= "red";if (passed == "true") {

fontColor= "green";

}

validateMessage.innerHTML= "" + message + " ";

}

servlet代码与GET方式相同。

POST方式解析文本的AJAX

js代码:

varxmlHttp;//创建XMLHttpRequest对象

functioncreateXMLHttpRequest() {if(window.ActiveXObject) {

xmlHttp= new ActiveXObject("Microsoft.XMLHTTP");

}else if(window.XMLHttpRequest) {

xmlHttp= newXMLHttpRequest();

}

}functionvalidate() {//创建xmlHttp对象

createXMLHttpRequest();//使用DOM,得到id值是username的域

var username = document.getElementById("username");var url = "ValidateUsernameServlet2";//向服务器端的 ValidateUsernameServlet发送异步请求

xmlHttp.open("POST", url, true);

xmlHttp.setRequestHeader("Content-Type","application/x-www-form-urlencoded");//当状态有变化的时候,调用callback方法

xmlHttp.onreadystatechange =callback;

xmlHttp.send("username="+encodeURI(username));

}functioncallback() {//当客户端完全接收完服务器的响应后,并且状态为200,也就是正常

if (xmlHttp.readyState == 4) {if (xmlHttp.status == 200) {//使用responseXML属性,接收服务器端返回的的XML文件 ,使用DOM解析XML

var responseText=xmlHttp.responseText;

document.getElementById("usernamemsg").innerHTML=responseText;

}

}

}

servlet代码:

public class ValidateUsernameServlet2 extendsHttpServlet {public voiddoGet(HttpServletRequest request, HttpServletResponse response)throwsServletException, IOException {

doPost(request, response);

}public voiddoPost(HttpServletRequest request, HttpServletResponse response)throwsServletException, IOException {

response.setContentType("text/html;charset=utf-8");

request.setCharacterEncoding("utf-8");boolean flag = true;

String message= "";//用户名可以使用

boolean e = true;if (e == true) {

message= "用户名可以使用";

}else{

flag= false;

message= "用户名已经存在,请选择使用其他用户名";

}//将校验的结果,以XML格式返回给客户端

response.setContentType("text/xml;charset=utf-8");

PrintWriter out=response.getWriter();//禁止缓存 HTTP1.0中通过Pragma 控制页面缓存,HTTP1.1中启用Cache-Control 来控制页面的缓存与否//参数:no-cache,浏览器和缓存服务器都不应该缓存页面信息;

response.setHeader("Cache-Control", "no-cache");

out.println("" + message + "");

out.flush();

out.close();

}

}

原文:http://www.cnblogs.com/lm970585581/p/7220382.html

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.mzph.cn/news/487468.shtml

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

你以为美国商业航天那么牛只是因为马斯克?更多原因在这里!

来源&#xff1a;银河航天漫游指南2020年5月31日&#xff0c;SpaceX的载人龙飞船成功将两位宇航员成功送往国际空间站&#xff0c;成为有史以来第一家将人类送入太空轨道的私营企业。美国商业航天领域的进展有目共睹。载人龙飞船起飞瞬间这次成功发射打破了传统航天领域以国家力…

APP开发流程

https://wenku.baidu.com/view/04a51445c77da26924c5b058.html?fromsearch转载于:https://www.cnblogs.com/ada-openmind/p/7634453.html

java游戏应龙女魃转世_应龙和女魃的凄美爱情,究竟是爱情,还是阴谋?

人世间最痛苦的事情是什么&#xff1f;有人说是生老病死&#xff0c;也有人说是爱憎别离。对于她来说&#xff0c;或许最痛苦的是他的欺骗与背叛……女魃一、初见北荒往东二百里&#xff0c;有一座山&#xff0c;名唤玲珑山。山中住着一名神女&#xff0c;名为女魃。相传&#…

热点|因为AI不是人,美国专利局拒绝认定TA的所有发明权

来源&#xff1a;量子位「你不是人&#xff01;」——美国专利局&#xff08;USPTO&#xff09;。这句话是美国专利局&#xff0c;对所有人工智能说的。4月27日&#xff0c;美国专利局出台一项规定&#xff1a;对于任何由人工智能独立设计发明的产品&#xff0c;因为AI不是自然…

登陆界面代码

1、设计思想 添加窗口界面&#xff0c;想i面添加一系列组件。 输入账号密码和验证码后&#xff0c;如果验证码正确&#xff0c;进行注册&#xff0c;否则注册失败。注册成功后&#xff0c;验证码自动刷新&#xff0c;并将注册的帐号和密码保存。注册失败后&#xff0c;验证码刷…

java中如何调出字体对话框_java 字体对话框

本人不才&#xff01;花了很长时间写了这个代码。不是很好&#xff0c;比起Windows自带的字体对话框差一点。不过已经够用了。等将来有时间了&#xff0c;在进行完善。如果有什么好的建议&#xff0c;可以提。本人再补。预览效果如下图&#xff1a;package styleDispose;import…

为何苹果为何苹果甘愿冒险自主研发芯片?

来源&#xff1a;内容来自「腾讯科技」7月4日&#xff0c;据外媒报道&#xff0c;苹果不久前宣布将把Mac上使用的处理器从英特尔芯片迁移到自己的Apple Silicon上&#xff0c;尽管这是意料之中的事&#xff0c;但苹果为何甘愿冒险甚至似乎相当渴望进行这种转型的&#xff0c;仍…

用MXNet实现mnist的生成对抗网络(GAN)

用MXNet实现mnist的生成对抗网络(GAN) 生成式对抗网络&#xff08;Generative Adversarial Network&#xff0c;简称GAN&#xff09;由一个生成网络与一个判别网络组成。生成网络从潜在空间&#xff08;latent space&#xff09;中随机采样作为输入&#xff0c;其输出结果需要尽…

java单元格合并多列_ElementUI表格列相同值自动合并单元格( 多列 )

上篇文章写了如何在处理单列相同数据时让相同的项进行自动合并, 如果有多列合并的需求我们也应该可以从容应对...(产品: 你们看我干嘛?)废话不多说 上代码HTMLJSvar Main {data() {return {tableData6: [{name: 部门1,type: 0,amount1: 跟单员1,amount2: 成衣工厂1,amount3: …

【MIT港科大】最新《贝叶斯深度学习》2020综述论文,35页pdf全面阐述最新进展...

来源&#xff1a;专知来自MIT和香港科技大学的学者最新《贝叶斯深度学习》综述论文&#xff0c;值得关注&#xff01;地址&#xff1a;https://www.zhuanzhi.ai/paper/9b781282204cb581a31aa0e8b570dd95摘要一个综合的人工智能系统不仅需要用不同的感官(如视觉和听觉)感知环境&…

VisualVM远程监控Java

1、服务器启动jstatd服务设置&#xff1a; jstatd将使用RMISecurityPolicy&#xff0c;并且需要指定安全策略文件. 安全策略文件必须符合安全策略语法&#xff0c;通过命令 jstatd -J-Djava.security.policyfile指定策略文件。以下的安全策略配制是可以访问所有代码库. grant c…

java枚举怎么编译不行的_java – 打开枚举时Maven编译失败

我是一个mavenifying(是一个单词&#xff1f;)一个项目,其构建过程到目前为止完全基于ant /shell脚本.请考虑以下枚举public enum ResourceType {A, B;}以下bean&#xff1a;public ResourceTypeOwner {//set get resourceType property}以下代码片段&#xff1a;void foo(Reso…

​ 长达35页!美国公布未来新兴科技趋势报告

本文来源&#xff1a;笔记侠未来智能实验室的主要工作包括&#xff1a;建立AI智能系统智商评测体系&#xff0c;开展世界人工智能智商评测&#xff1b;开展互联网&#xff08;城市&#xff09;云脑研究计划&#xff0c;构建互联网&#xff08;城市&#xff09;云脑技术和企业图…

Linux命令行之逗趣无极限

Reference: http://os.51cto.com/art/201304/390059.htm 【2013年4月18日 51CTO外电头条】你有没有在Linux命令行中见过一辆火车呢&#xff1f;"猫跟老鼠"呢&#xff1f;编辑Linux命令行其实并不总是件严肃古板的事情。你完全可以用它自娱自乐。下面我们就跟大家一起…

java web的友好页面_JavaWeb 之 由 Tomcat 展示友好的错误信息页面

在 JavaWeb 工程中&#xff0c;可能会遇到 404 或 500 的错误页面&#xff0c;也有可能是由于异常显示的空白页面&#xff0c;但是此时并不想把这些页面给用户呈现出来&#xff0c;这时就需要给用户提示一些友好的信息。在部署 JavaWeb 工程时&#xff0c;只需要在 web.xml 中指…

【计算机视觉】计算机视觉入门大全:基础概念、运行原理、应用案例详解

来源&#xff1a;图灵人工智能 「机器能够模拟人类视觉系统」的幻想已经过时了。自 1960 年代第一批学术论文出现以来&#xff0c;计算机视觉已经走了很远&#xff0c;现代系统已经出现&#xff0c;且它们可以集成到移动应用中。今天&#xff0c;由于其广泛应用和巨大潜力&…

PHP中对hmac_sha1签名算法的实现方法

最近研究网宿云文档API&#xff0c;其中用到了一种叫hmac_sha1的签名算法&#xff1b; HMAC-SHA1&#xff1a; HMAC是哈希运算消息认证码 (Hash-based Message Authentication Code)&#xff0c;HMAC运算利用哈希算法&#xff0c;以一个密钥和一个消息为输入&#xff0c;生成一…

对10亿个数据去重java_20 亿个数字在 4G 内存中如何去重排序:快来试一试 BitMap...

有一道流传广泛的面试题&#xff1a;给你一台 4G 内存的机器&#xff0c;一组 20 亿个无序正整数&#xff0c;如何快速地判断一个正整数 N 是否在这组数字中&#xff1f;或者如何快速地对这组数据排重后排序&#xff1f;让我们先算算 20 亿个整数会占用多大的内存空间&#xff…

大佬共话AI:“三马二宏”等亮相2020年世界人工智能大会

&#xff08;视频来源&#xff1a;腾讯视频新民晚报&#xff09;来源 | 数据观综合&#xff08;转载请注明来源&#xff09;编辑 | 蒲蒲7月9日上午&#xff0c;2020世界人工智能大会云端峰会(WAIC)在上海正式开幕&#xff0c;人工智能概念又一次被行业点燃。大会上&#xff0c;…

浅谈Spring的AOP实现-代理机制

说起Spring的AOP(Aspect-Oriented Programming)面向切面编程大家都很熟悉&#xff08;Spring不是这次博文的重点&#xff09;&#xff0c;但是我先提出几个问题&#xff0c;看看同学们是否了解&#xff0c;如果了解的话可以不用继续往下读&#xff1a; 1. Spring的AOP的实现方式…