XMLHTTP中readState与status的状态值
0 (未初始化) 对象已建立,但是尚未初始化(尚未调用open方法)
1 (初始化) 对象已建立,尚未调用send方法
2 (发送数据) send方法已调用,但是当前的状态及http头未知
3 (数据传送中) 已接收部分数据,因为响应及http头不全,这时通过responseBody和responseText获取部分数据会出现错误,
4 (完成) 数据接收完毕,此时可以通过通过responseBody和responseText获取完整的回应数据
当readState为4 status为200时说明成功
通过responseText获取servlet的文本
jsp
<%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%>
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<script>
function getContent() {
var xmlHttp;
xmlHttp = createXmlHttp();
alert("readyState:"+xmlHttp.readyState + "status:"+xmlHttp.status);
xmlHttp.onreadystatechange=function (){
alert("readyState:"+xmlHttp.readyState + "status:"+xmlHttp.status);
if (xmlHttp.readyState == 4 && xmlHttp.status == 200){
alert(xmlHttp.responseText);
var text = document.getElementById("text");
text.value=xmlHttp.responseText;
}
};
xmlHttp.open("get", "servlet", true);
xmlHttp.send(null);
}
function createXmlHttp() {
var xmlHttp;
if(window.XMLHttpRequest)
{
xmlHttp = new XMLHttpRequest();
}
//兼容IE
else if(window.ActiveXObject)
{
xmlHttp = new ActiveXObject("Microsoft.XMLHTTP");
if(!xmlHttp)
{
xmlHttp = new ActiveXObject("Msxml2.XMLHTTP");
}
}
return xmlHttp;
}
</script>
</head>
<body>
<input type="text" id="text">
<button id="btn" onclick="getContent()">获取ajax数据</button>
</body>
</html>
servlet
package com.cyh.test;
import java.io.IOException;
import java.io.PrintWriter;
import javax.servlet.ServletException;
import javax.servlet.http.HttpServlet;
import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.HttpServletResponse;
public class Servlet extends HttpServlet {
public void doGet(HttpServletRequest request, HttpServletResponse response)
throws ServletException, IOException {
request.setCharacterEncoding("UTF-8");
response.setCharacterEncoding("UTF-8");
PrintWriter out = response.getWriter();
out.println("后台发送的数据");
}
public void doPost(HttpServletRequest request, HttpServletResponse response)
throws ServletException, IOException {
}
}
若servlet发送json格式
package com.cyh.test;
import java.io.IOException;
import java.io.PrintWriter;
import javax.servlet.ServletException;
import javax.servlet.http.HttpServlet;
import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.HttpServletResponse;
public class Servlet extends HttpServlet {
public void doGet(HttpServletRequest request, HttpServletResponse response)
throws ServletException, IOException {
request.setCharacterEncoding("UTF-8");
response.setCharacterEncoding("UTF-8");
//json格式{k : v, k : v}
String content = "{\"name\":\"张三\" , \"age\":\"18\"}";
PrintWriter out = response.getWriter();
out.println(content);
}
public void doPost(HttpServletRequest request, HttpServletResponse response)
throws ServletException, IOException {
System.out.println("post");
}
}
前台接受
<%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%>
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<script>
function getContent() {
var xmlHttp;
xmlHttp = createXmlHttp();
xmlHttp.onreadystatechange=function (){
if (xmlHttp.readyState == 4 && xmlHttp.status == 200){
alert(xmlHttp.responseText);
}
};
xmlHttp.open("get", "servlet", true);
xmlHttp.send(null);
}
function createXmlHttp() {
var xmlHttp;
if(window.XMLHttpRequest)
{
xmlHttp = new XMLHttpRequest();
}
//兼容IE
else if(window.ActiveXObject)
{
xmlHttp = new ActiveXObject("Microsoft.XMLHTTP");
if(!xmlHttp)
{
xmlHttp = new ActiveXObject("Msxml2.XMLHTTP");
}
}
return xmlHttp;
}
</script>
</head>
<body>
姓名<input type="text" id="name"><br>
年龄<input type="text" id="age"><br>
<button id="btn" onclick="getContent()">获取ajax数据</button>
</body>
</html>
返回的形式是{“name”:”张三”, “age”:”18”}
通过 var obj = eval(“(“+xmlHttp.responseText+”)”);
返回的obj就是一对象, 可以输出key对应的值
alert(obj.name);
alert(obj.age);
导入json jar包
在servlet中可以这样设置
JSONObject content = new JSONObject();
content.put(“name”, “张三”);
content.put(“age”,”19”);