您的位置:首页 > 编程语言 > Java开发

ajax将java后台响应字符串,放在指定控件里

2017-08-02 14:42 323 查看


example1.html

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<script type="text/javascript" src="${pageContext.request.contextPath}/util.js"></script>
<title>ajax学习</title>
<script>
function getXHR(){
var xmlHttp;
if(window.ActiveXObject){
xmlHttprequest = new ActiveXObject("Microsoft.XMLHTTP");

}else if(window.XMLHttpRequest){
xmlHttprequest = new XMLHttpRequest;

}
return xmlHttprequest;
}

window.onload=function(){
document.getElementById("btn1").onclick=function(){
//发出已补请求
//1/得到xhr对象
var xhr=getXHR();
//2.注册状态变化监听器
xhr.onreadystatechange=function(){
if(xhr.readyState==4)
{
if(xhr.status==200)
{
//alert("服务器响应了");
document.getElementById("result").value=xhr.responseText;
//将返回的登录结果返回,放在result框中
}
}
}
var v11=document.getElementById("v1").value;
var v22=document.getElementById("v2").value;
//3.建立与服务器的连接
// xhr.open("GET","ajax/AjaxServlet"+"?time="+new Date().getTime(),true);
xhr.open("GET","ajax/AjaxServlet?v1="+v11+"&v2="+v22,true);
//4.向服务器发出请求
xhr.send();
}
}
</script>
</head>
<body>
用户名:<input type="text" id="v1"></input><br><br>
密   码:<input type="text" id="v2"></input><br><br>
<button id="btn1">登 录</button><br><br>
结   果:<input id="result"></input>
</body>
</html>

web.xml添加如下代码

<servlet>
<servlet-name>AjaxServlet</servlet-name>
<servlet-class>ajax.AjaxServlet</servlet-class>
</servlet>
<servlet-mapping>
<servlet-name>AjaxServlet</servlet-name>
<url-pattern>/ajax/AjaxServlet</url-pattern>
</servlet-mapping>

AjaxServlet.java

package ajax;

import java.io.IOException;
import java.io.PrintWriter;
import java.text.SimpleDateFormat;
import java.util.Date;

import javax.servlet.ServletException;
import javax.servlet.annotation.WebServlet;
import javax.servlet.http.HttpServlet;
import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.HttpServletResponse;

/**
* Servlet implementation class AjaxServlet
*/
@WebServlet("/AjaxServlet")
public class AjaxServlet extends HttpServlet {
private static final long serialVersionUID = 1L;

/**
* @see HttpServlet#HttpServlet()
*/
public AjaxServlet() {
super();
// TODO Auto-generated constructor stub
}

/**
* @see HttpServlet#doGet(HttpServletRequest request, HttpServletResponse response)
*/
protected void doGet(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
// TODO Auto-generated method stub
doPost(request, response);
}

/**
* @see HttpServlet#doPost(HttpServletRequest request, HttpServletResponse response)
*/
protected void doPost(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
// TODO Auto-generated method stub
response.setCharacterEncoding("utf-8");
response.setContentType("text/html");
String user=request.getParameter("v1");
String password=request.getParameter("v2");
int flag=0;
if(user.equals("123") && password.equals("123"))
flag=1;
System.out.println("ajax后台交互成功");
PrintWriter write=response.getWriter();
write.println(flag);
System.out.println(user+" "+password);
write.flush();
}

}


内容来自用户分享和网络整理,不保证内容的准确性,如有侵权内容,可联系管理员处理 点击这里给我发消息
标签:  ajax java后台 控件