ajax获取servlet发送的数据

来源：互联网发布：清理后台的软件编辑：程序博客网时间：2024/05/20 23:29

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”);

阅读全文

0 0