ajax+servlet

最新推荐文章于 2024-11-19 10:44:10 发布

jaky821

最新推荐文章于 2024-11-19 10:44:10 发布

阅读量455

点赞数

文章标签： Servlet Ajax Microsoft XML JSP

本文介绍了一个使用JSP和Ajax实现客户端与服务器端交互的简单示例。该示例通过Ajax向服务器发送请求，并根据服务器返回的状态改变输入框的颜色。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

JSP:
Java代码
<%@ page contentType="text/html; charset=UTF-8"%>
<%@ page pageEncoding="UTF-8"%>

<html>
<head>
<title>
ajax<%=request.getContextPath()%>
</title>
</head>
<body bgcolor="#ffffff">
<h1>
name:<input id="view_name" type="text" maxlength="20" onBlur="testName(this.id)" /> <br />
<input type="button" value="check" onClick="testName('view_name')" />
<div ></div>
</h1>

<script language="javascript">
function testName(txt_ctr){

if (window.ActiveXObject && !window.XMLHttpRequest) {
window.XMLHttpRequest=function() {
return new ActiveXObject((navigator.userAgent.toLowerCase().indexOf('msie 5') != -1) ? 'Microsoft.XMLHTTP' : 'Msxml2.XMLHTTP');
};
}//取得XMLHttpRequest对象

//path是取得系统路径
var txt_ctr=document.getElementById(txt_ctr);
var url = "/alfi/AjaxServlet?parm=" + txt_ctr.value ;
var req=new XMLHttpRequest();
if (req) {
req.onreadystatechange=function() {
if (req.readyState==4 && req.status==200) {//判断状态，4是已发送，200已完成
alert("req.status: " + req.status);
alert("req.responseTex: " + req.responseText);
if(req.responseText==11){
txt_ctr.style.color='green';
}else if(req.responseText==1){
txt_ctr.style.color='red';
}else{
txt_ctr.style.color='red';
}
}
}
req.open('POST', url, true);
req.setRequestHeader('Content-Type', 'application/x-www-form-urlencoded');
alert(txt_ctr.value);
req.send(txt_ctr.value);//发送参数如果有参数req.send("username="+user_name);用request取得
}
}
</script>
</body>
</html>

<%@ page contentType="text/html; charset=UTF-8"%>
<%@ page pageEncoding="UTF-8"%>

<html>
<head>
<title>
ajax<%=request.getContextPath()%>
</title>
</head>
<body bgcolor="#ffffff">
<h1>
name:<input id="view_name" type="text" maxlength="20" onBlur="testName(this.id)" /> <br />
<input type="button" value="check" onClick="testName('view_name')" />
<div ></div>
</h1>

<script language="javascript">
function testName(txt_ctr){

if (window.ActiveXObject && !window.XMLHttpRequest) {
window.XMLHttpRequest=function() {
return new ActiveXObject((navigator.userAgent.toLowerCase().indexOf('msie 5') != -1) ? 'Microsoft.XMLHTTP' : 'Msxml2.XMLHTTP');
};
}//取得XMLHttpRequest对象

//path是取得系统路径
var txt_ctr=document.getElementById(txt_ctr);
var url = "/alfi/AjaxServlet?parm=" + txt_ctr.value ;
var req=new XMLHttpRequest();
if (req) {
req.onreadystatechange=function() {
if (req.readyState==4 && req.status==200) {//判断状态，4是已发送，200已完成
alert("req.status: " + req.status);
alert("req.responseTex: " + req.responseText);
if(req.responseText==11){
txt_ctr.style.color='green';
}else if(req.responseText==1){
txt_ctr.style.color='red';
}else{
txt_ctr.style.color='red';
}
}
}
req.open('POST', url, true);
req.setRequestHeader('Content-Type', 'application/x-www-form-urlencoded');
alert(txt_ctr.value);
req.send(txt_ctr.value);//发送参数如果有参数req.send("username="+user_name);用request取得
}
}
</script>
</body>
</html>

servlet:AjaxServlet.java

Java代码
public void doGet(HttpServletRequest req, HttpServletResponse res)
throws ServletException, RemoteException, IOException{
doPost(req, res);
}

public void doPost(HttpServletRequest req, HttpServletResponse res)
throws ServletException, IOException {

res.setContentType("text/xml; charset=UTF-8");
String ctrl_value = req.getParameter("parm");
PrintWriter out = res.getWriter();
String downStr="";
System.out.println("&&&&&&&&&&&&&" + ctrl_value);
out.print(11);

}

public void doGet(HttpServletRequest req, HttpServletResponse res)
throws ServletException, RemoteException, IOException{
doPost(req, res);
}

public void doPost(HttpServletRequest req, HttpServletResponse res)
throws ServletException, IOException {

res.setContentType("text/xml; charset=UTF-8");
String ctrl_value = req.getParameter("parm");
PrintWriter out = res.getWriter();
String downStr="";
System.out.println("&&&&&&&&&&&&&" + ctrl_value);
out.print(11);

}

web.xml

Java代码
<servlet>
<servlet-name>AjaxServlet </servlet-name>
<servlet-class>com.autobacs.servlet.AjaxServlet </servlet-class>
</servlet>

<servlet-mapping>
<servlet-name>AjaxServlet </servlet-name>
<url-pattern>/AjaxServlet</url-pattern>
</servlet-mapping>