jQuery Ajax前后端使用JSON进行交互示例

发布时间：2020-12-15 23:19:10 所属栏目：百科来源：网络整理

导读：需求：前端通过jQuery Ajax传输json到后端，后端接收json，对json进行处理，后端返回一个json给前端这里使用servlet的方式 1、采用$.post方法 index.jsp页面用户ID: CheckServlet.Java代码如下 import java.io.IOException; import java.io.PrintWriter;

需求：

前端通过jQuery Ajax传输json到后端，后端接收json，对json进行处理，后端返回一个json给前端

这里使用servlet的方式

1、采用$.post方法

index.jsp页面

用户ID:

CheckServlet.Java代码如下

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 CheckServlet extends HttpServlet {

public void doGet(HttpServletRequest request,HttpServletResponse response)
throws ServletException,IOException {
this.doPost(request,response);
}

public void doPost(HttpServletRequest request,IOException {
/设置字符集为'UTF-8'/
request.setCharacterEncoding("UTF-8");
response.setCharacterEncoding("UTF-8");
String userid = request.getParameter("userid"); // 接收userid
String sex = request.getParameter("sex");//接收性别
System.out.println(userid);
System.out.println(sex);

//写返回的JSON 
PrintWriter pw = response.getWriter(); 
String json = "{'success':'成功','false':'失败'}"; 
pw.print(json); 
pw.flush(); 
pw.close();

}
}

由于这里采用的是servlet的方式，所以要配置web.xml

Ajax

CheckServlet

com.ajax.CheckServlet

CheckServlet

/Ajax/CheckServlet

在页面输入一个ID，可以在后台接收到并且打印出来，后台通过PrintWriter进行回写JSON返回前端，前端通过eval将JSON变换为Object对象，通过obj.name获取JSON值

2、采用$.get方法，只需要将jsp页面里面的post改为get即可

用户ID:
<input type="text" id="userid" name="userid"> <span id="msg">

<button onclick="checkUserid()">传输

结果与$.post一样

3、通过$.ajax方法

用户ID:
<input type="text" id="userid" name="userid"> <span id="msg">

<button onclick="checkUserid()">传输

$.ajax方法也是可以分为post和get方法的，通过修改type来修改发送的方式

结果与方法1是相同的

以上就是本文的全部内容，希望对大家的学习有所帮助，也希望大家多多支持编程之家。

（编辑：李大同）

【声明】本站内容均来自网络，其相关言论仅代表作者个人观点，不代表本站立场。若无意侵犯到您的权利，请及时与联系站长删除相关内容!