您的位置:首页 > Web前端 > JavaScript

json格式ajax的post请求方式

2016-08-14 09:53 399 查看
1.java代码如下:

package com.eduask;

import java.io.IOException;

import javax.servlet.ServletException;

import javax.servlet.http.HttpServlet;

import javax.servlet.http.HttpServletRequest;

import javax.servlet.http.HttpServletResponse;

public class Demo5 extends HttpServlet{

@Override

protected void service(HttpServletRequest req, HttpServletResponse resp)

throws ServletException, IOException {

resp.setContentType("text/xml;charset=utf-8");

String name=req.getParameter("username1");

resp.setCharacterEncoding("utf-8");

String msg="";

if ("tom".equals(name)) {

msg="{'msg':'failed'}";

resp.getWriter().write(msg);

}else{

msg="{'msg':'success'}";

resp.getWriter().write(msg);

}

}

}

2.json.jsp代码如下:

<body>

<!--   function Person(id,name,pwd){

this.id=id;

this.name=name;

this.pwd=pwd;

}

var p=new Person(1234,"tom","1234");

alert(p.id+"--"+p.name+"--"+p["pwd"]);

var p1={

'id':234,

'name':"jack",

'pwd':"123"

};

function Person(){

this.name="tom";

this.age=23;

}

alert(p1.id+"--"+p1.name+"--"+p1["pwd"]);

-->

username1:<input type="text" id="username1" name="username1">

<span id="msg1"></span>

<script type="text/javascript">

//===================post=====================================================

         var post=document.getElementById("username1");

post.onblur=function(){

var xhr=getXhr();

xhr.onreadystatechange=function(){

if (xhr.readyState==4) {

if (xhr.status==200) {

//字符串格式的数据

                  var msg1=xhr.responseText;

//转换为json对象

msg1=eval("("+msg1+")")

var span=document.getElementById("msg1");

//通过对象.属性名称获取属性的值

span.innerHTML="<font color=red>"+msg1.msg+"</font>";

}

}

}

xhr.open("post","/ajax/Demo5");

//设置消息头,告诉浏览器携带请求体数据

xhr.setRequestHeader("content-type","application/x-www-form-urlencoded");

/* */ var span=document.getElementById("msg1");

span.innerHTML="正在加载数据...";

xhr.send("username1="+post.value);

}

function getXhr(){

var xhr;

if (window.XMLHttpRequest) {

xhr=new XMLHttpRequest();

}else{

xhr=new ActiveXObject("microsoft.xmlhttp");

}

return xhr;

}

</script>

</body>

3.web.xml配置文件如下:

<!-- demo5 -->

<servlet>

<servlet-name>Demo5</servlet-name>

<servlet-class>com.eduask.Demo5</servlet-class>

</servlet>

<servlet-mapping>

<servlet-name>Demo5</servlet-name>

<url-pattern>/Demo5</url-pattern>

</servlet-mapping>
内容来自用户分享和网络整理,不保证内容的准确性,如有侵权内容,可联系管理员处理 点击这里给我发消息
相关文章推荐