AJAX+Servlet实现的数据处理显示功能示例

2023-09-11 22:01:06 73

本文实例讲述了AJAX+Servlet实现的数据处理显示功能。分享给大家供大家参考，具体如下：

实现功能：在输入框中输入字符，用AJAX传到后台Servlet处理后加上随机数，并返回到前台显示。

一、写前台jsp页面index.jsp

<%@pagelanguage="java"import="java.util.*"pageEncoding="utf-8"%>



MyJSP'index.jsp'startingpage

/*
ajax的几个步骤：
1、建立XmlHttpRequest对象
2、设置回调函数
3、使用Open方法建立与服务器的连接
4、向服务器发送数据
5、在回调函数中针对不同响应状态进行处理
*/
varxmlHttp;
functioncreateXMLHttpRequest(){//1建立XmlHttpRequest对象
if(window.ActiveXObject){
try{
xmlHttp=newActiveXObject("Microsoft.XMLHttp");
}catch(e){
alert("Error!!!");
}
}else{
xmlHttp=newXMLHttpRequest();
}
}
functionshowMes(){//2设置回调函数
if(xmlHttp.readyState==4){//数据接收完成并可以使用
if(xmlHttp.status==200){//http状态OK
//5、在回调函数中针对不同响应状态进行处理
document.getElementById("sp").innerHTML=xmlHttp.responseText;//服务器的响应内容
}else{
alert("出错："+xmlHttp.statusText);//HTTP状态码对应的文本
}
}
}
/**
//这是GET方法传送
functiongetMes(){
createXMLHttpRequest();
vartxt=document.getElementById("txt").value;
varurl="servlet/AjaxServlet?txt="+txt;
url=encodeURI(url);//转换码后再传输
xmlHttp.open("GET",url,true);//3使用Open方法建立与服务器的连接
xmlHttp.onreadystatechange=showMes;
xmlHttp.send(null);//4向服务器发送数据
}
*/
/**
*这是post方法
*/
functionpostMes(){
createXMLHttpRequest();
vartxt=document.getElementById("txt").value;
varurl="servlet/AjaxServlet";
varparams="username="+txt;
//alert(params);
xmlHttp.open("POST",url,true);
xmlHttp.setRequestHeader("Content-Type","application/x-www-form-urlencoded;charset=UTF-8");
xmlHttp.send(params);
xmlHttp.onreadystatechange=showMes;
}

二、写后台Servlet加random随机数，关键代码如下：

publicvoiddoGet(HttpServletRequestrequest,HttpServletResponseresponse)
throwsServletException,IOException{
request.setCharacterEncoding("utf-8");//用utf-8转换获得传输过来的码
response.setContentType("text/html");
PrintWriterout=response.getWriter();
Stringtxt=request.getParameter("txt");
//Stringtx=newString(txt.getBytes("iso-8859"),"utf-8");
out.print("txt="+txt+Math.random());
out.flush();
out.close();
}
/**
*ThedoPostmethodoftheservlet.

*
*Thismethodiscalledwhenaformhasitstagvaluemethodequalstopost.
*
*@paramrequesttherequestsendbytheclienttotheserver
*@paramresponsetheresponsesendbytheservertotheclient
*@throwsServletExceptionifanerroroccurred
*@throwsIOExceptionifanerroroccurred
*/
publicvoiddoPost(HttpServletRequestrequest,HttpServletResponseresponse)
throwsServletException,IOException{
request.setCharacterEncoding("utf-8");
response.setContentType("text/html;charset=UTF-8");
PrintWriterout=response.getWriter();
Stringusername=request.getParameter("username");
//Stringtxt=newString(username.getBytes("ISO-8859-1"),"UTF-8");
Stringtxt=newString(username);
out.print("txt="+txt+":"+Math.random());
out.flush();
out.close();
}

更多关于ajax相关内容感兴趣的读者可查看本站专题：《jquery中Ajax用法总结》、《JavaScript中ajax操作技巧总结》、《PHP+ajax技巧与应用小结》及《asp.netajax技巧总结专题》

希望本文所述对大家ajax程序设计有所帮助。

AJAX+Servlet实现的数据处理显示功能示例

热门推荐

随机推荐