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>
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>
相关文章推荐
- ajax请求当发送post方式application/json格式数据,url后面又带有参数的时候
- SpringMVC中使用Ajax POST请求以json格式传递参数服务端通过request.getParameter("name")无法获取参数值问题分析
- java ajax post跨域请求传递json格式数据问题
- 使用jQuery发送POST,Ajax请求返回JSON格式数据
- php学习笔记(三十)ajax请求和接收参数的实现方式(包括json数据格式的简单处理)
- ThinkPHP以jquery传送json数据格式的方式实现ajax请求
- get、post、ajax、getJSON四种请求方式
- SpringMVC中使用Ajax POST请求以json格式传递参数服务端通过request.getParameter("name")无法获取参数值问题分析
- jQuery的ajax的post请求json格式无法上传空数组
- Java 以post请求方式通过json格式调用Webservice接口
- jquery之利用ajax与服务器交谈(发起GET和POST请求之获取JSON数据)
- 在ajax请求中使用json数据格式
- Ajax中请求方式(GET/POST)之GET与POST方式区别
- AJAX中的POST请求方式
- WebService 通过POST方式访问时候,因 URL 意外地以“/方法名”结束,请求格式无法识别 解决办法
- Ajax中请求方式(GET/POST)之GET方式
- WebService 通过POST方式访问时候,因 URL 意外地以“/方法名”结束,请求格式无法识别 解决办法
- java代码发送JSON格式的httpPOST请求
- Ajax核心XMLHttpRequest对象、(发送请求、接收)方法和属性介绍、AJAX开发框架、数据格式提要(XML、JSON、HTML)
- java代码发送JSON格式的httpPOST请求