学习笔记：AJAX和JSON

最新推荐文章于 2024-08-17 21:47:42 发布

yipfang

最新推荐文章于 2024-08-17 21:47:42 发布

阅读量221

点赞数 1

分类专栏： JavaWeb

本文链接：https://blog.csdn.net/yipfang/article/details/120339827

版权

ajax javascript html5

JavaWeb 专栏收录该内容

11 篇文章 0 订阅

订阅专栏

AJAX = Asynchronous JavaScript and XML （异步的 JavaScript 和 XML ）。

jquery方式的AJAX操作

$.ajax({
 url:请求地址
 type:"get | post | put | delete " 默认是get,
 data:请求参数 {"id":"123","pwd":"123456"},
 dataType:请求数据类型"html | text | json | xml | script | jsonp ",
 success:function(data,dataTextStatus,jqxhr){ },//请求成功时 
error:function(jqxhr,textStatus,error)//请求失败时
})

简化版

$.get(url,data,function(result) {
 //省略将服务器返回的数据显示到⻚⾯的代码
});

$.post(url,data,function(result) {
 //省略将服务器返回的数据显示到⻚⾯的代码
});

url: 请求的路径

data: 发送的数据

success: 成功函数

datatype 返回的数据

JSON

Json定义格式：

var 变量名 = {
“key” : value , // Number类型
“key2” : “value” , // 字符串类型
“key3” : [] , // 数组类型
“key4” : {}, // json 对象类型
“key5” : [{},{}] // json 数组
};

JSON对象的访问

使⽤【对象名.属性名】的⽅式

JSON在java中的使⽤(重要)

java对象和json之间的转换

java->json：

Users user2=new Users();
user2.setUsername("李四");
user2.setPassword("abc");
user2.setAge(20);
JSONObject obj=JSONObject.fromObject(user);//obj就是json格式的

json->java ：

String str="{'username':'李四','password':'admin','age':19}";
JSONObject json=JSONObject.fromObject(str);
Users user=(Users)JSONObject.toBean(json,Users.class);

java集合->json数组:

List list=new ArrayList();
list.add("dd");
list.add("aa");
JSONArray obj=JSONArray.fromObject(list);//set也是这么转

json数组->java集合:

String str2="[{'age':20,'password':'abc','username':'李四'},
{'age':10,'password':'adb','username':'张三'}]";
 JSONArray json2=JSONArray.fromObject(str2);
Object[] obj=(Object[])JSONArray.toArray(json2,Users.class);

ajax实例2-实现数据的⾃动填充：

依赖：

⻚⾯:

<%--
  Created by IntelliJ IDEA.
  User: fye
  Date: 2021/9/16
  Time: 23:57
  To change this template use File | Settings | File Templates.
--%>
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<html>
  <head>
    <title>Test</title>
    <script type="text/javascript" src="js/jquery-1.11.1.min.js"></script>
    <script type="text/javascript">
      $(function (){
        $("#name").blur(function (){
          var name = $(this).val();
          $.post("/testname","name="+name,function (rsjson){
            $("#age").val("");
            $("#sex").val("");
            rsjson=eval("("+rsjson+")");
            $("#rs").html(rsjson[0].rs);
            $("#age").val(rsjson[1].age);
            $("#sex").val(getsex(rsjson[1].sex));
          });
        });
      })

      function getsex(sex){
        var str ="";
        if(sex!=null){
          str=(sex==0?"女":"男");
        }
        return str;
      }
    </script>

  </head>
  <body>
    <div style="text-align: center">
      姓名：<input type="text" id="name"><span id="rs"></span><br>
      年龄：<input type="text" id="age"><br>
      性别：<input type="text" id="sex">
    </div>
  </body>
</html>

后台：

实体类

package test.bean;

public class Student {
    private String name;
    private int age;
    private int sex;
}

处理类:

package test.servlet;

import net.sf.json.JSONArray;
import net.sf.json.JSONObject;
import test.bean.Student;

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.ArrayList;
import java.util.List;

/**
 * @Author: WindInForest
 * @Description:
 * @Date Created in 2021-09-17 0:50
 * @Modified By:
 */
@WebServlet(urlPatterns = "/testname")
public class testServlet extends HttpServlet {
    private ArrayList<Student> list=new ArrayList<Student>();
    {
        list.add(new Student("张三",18,1));
        list.add(new Student("李四",17,0));
        list.add(new Student("王五",19,1));
    }
    @Override
    protected void doGet(HttpServletRequest req, HttpServletResponse resp) throws ServletException, IOException {
        doPost(req, resp);
    }

    @Override
    protected void doPost(HttpServletRequest req, HttpServletResponse resp) throws ServletException, IOException {
        String name = req.getParameter("name");
        String rs="{'rs':'用户不存在，请输入个人信息'}";
        Student stu=null;
        for (Student student : list) {
            if(student.getName().equals(name)){
                rs="{'rs':'用户已存在'}";
                stu=student;
                break;
            }
        }
        List<JSONObject> jsonlist =new ArrayList<>();
        jsonlist.add(JSONObject.fromObject(rs));
        jsonlist.add(JSONObject.fromObject(stu));
        JSONArray obj = JSONArray.fromObject(jsonlist);

        resp.setContentType("text/html;charset=utf-8");
        PrintWriter writer = resp.getWriter();
        writer.print(obj);

    }

    @Override
    public void init() throws ServletException {
        super.init();
    }
}

yipfang

关注

1
点赞
踩
8

收藏

觉得还不错? 一键收藏
0
评论
学习笔记：AJAX和JSON

AJAX = Asynchronous JavaScript and XML（异步的 JavaScript 和 XML）。jquery方式的AJAX操作$.ajax({ url:请求地址 type:"get | post | put | delete " 默认是get, data:请求参数 {"id":"123","pwd":"123456"}, dataType:请求数据类型"html | text | json | xml | script | jsonp ", succes..
复制链接

扫一扫

专栏目录