Ajax处理JSON对象

最新推荐文章于 2022-03-04 17:02:15 发布

iuyou️

最新推荐文章于 2022-03-04 17:02:15 发布

阅读量779

点赞数

分类专栏： jQuery 文章标签： ajax json js jsp jsonp

本文链接：https://blog.csdn.net/qq_42219004/article/details/105485770

版权

jQuery 专栏收录该内容

6 篇文章 0 订阅

订阅专栏

Ajax处理单个对象

创建一个User类，在服务端servlet以json对象形式返回给客户端。

在这里插入图片描述

public class User {
    private String name;
    private int age;

    public String getName() {
        return name;
    }

    public void setName(String name) {
        this.name = name;
    }

    public int getAge() {
        return age;
    }

    public void setAge(int age) {
        this.age = age;
    }
      
}

servlet：

package org.youyuan.servlet.ajax;

import bean.User;
import org.json.JSONObject;
import javax.servlet.ServletException;
import javax.servlet.annotation.WebServlet;
import javax.servlet.http.HttpServlet;
import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.HttpServletResponse;
import java.io.IOException;
import java.io.PrintWriter;
import java.util.HashMap;

@WebServlet("/object")
public class Json extends HttpServlet {
    protected void service(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
        response.setContentType("text/html;charset=utf-8");
        request.setCharacterEncoding("utf-8");
        User u = new User();
        u.setAge(23);
        u.setName("zs"); 
        /*新建一个json对象*/
        HashMap<String, User> m = new HashMap<String, User>();
        m.put("stu",u); 
        JSONObject jsonObject = new JSONObject(m);
        /*响应给客户端*/
        PrintWriter writer = response.getWriter();
        writer.print(jsonObject);
        write.flush();
        write.close();
    }
}

jsp：

<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<html>
<head>
    <title>Title</title>
    <script src="https://code.jquery.com/jquery-3.2.1.min.js"></script>
    <script type="text/javascript">
        $(function () { 
            $("#submit").click(function () {
                $.post({
                    url:"/object", 
                    success:function(msg) {
                        console.log(msg);
                        //JSON.parse(jsonstr); //可以将json字符串转换成json对象
                        //JSON.stringify(jsonobj); //可以将json对象转换成json对符串
                        /*将java的返回值转换为js的json对象*/
                        var stu = $.parseJSON(msg);
                        alert(stu.stu);
                        alert(stu.stu.name);
                        alert(stu.stu.age);
                    }
                });
            }); 
    </script>
</head>
<body>
    <input id="submit" type="submit">
</body>
</html>

Ajax处理多个对象

处理多个对象与处理单个对象类似，只需在servlet当中添加多个User对象，在jsp中获取对象的集合数组，用数组遍历每个user对象。

@WebServlet("/object")
public class Json extends HttpServlet {
    protected void service(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
        response.setContentType("text/html;charset=utf-8");
        request.setCharacterEncoding("utf-8");
        User u = new User();
        u.setAge(23);
        u.setName("zs");

        User user = new User();
        user.setAge(10);
        user.setName("lisi");

        /*新建一个json对象*/
        HashMap<String, User> m = new HashMap<String, User>();
        m.put("stu",u);
        m.put("stu1",user);
        JSONObject jsonObject = new JSONObject(m);
        /*响应给客户端*/
        PrintWriter writer = response.getWriter();
        writer.print(jsonObject); 
    }
}

jsp：

<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<html>
<head>
    <title>Title</title>
    <script src="https://code.jquery.com/jquery-3.2.1.min.js"></script>
    <script type="text/javascript">
        $(function () { 
            /*多个json对象*/
            $("#submit").click(function () {
                $.get({
                    url:"/object",
                    //data:"name="+"zs",
                    success:function(msg) {
                        console.log(msg);
                        //JSON.parse(jsonstr); //可以将json字符串转换成json对象
                        //JSON.stringify(jsonobj); //可以将json对象转换成json对符串
                        /*将java的返回值转换为js的json对象*/
                        msg = $.parseJSON(msg);
                        $.each(msg,function (index,data) {
                            alert(this.name+"-->"+this.age);
                        })
                    }
                });
            });
        });
    </script>
</head>
<body>
    <input id="submit" type="submit">
</body>
</html>

iuyou️

关注

0
点赞
踩
2

收藏

觉得还不错? 一键收藏
0
评论
Ajax处理JSON对象

Ajax处理单个对象创建一个User类，在服务端servlet以json对象形式返回给客户端。public class User { private String name; private int age; public String getName() { return name; } public void setName(S...
复制链接

扫一扫

专栏目录