SpringMVC通過Ajax處理Json數據的步驟詳解

Posted on by

SpringMVC通過Ajax處理Json數據的實現

一、前言：

Ajax:
在不重新加載整個頁面的前提下，對網頁的部分進行刷新，例如點贊，發送短信驗證碼功能等等，都可以通過ajax進行實現，Ajax實現瞭網頁的異步刷新

想要實現的效果，點擊按鈕，前端顯示後臺發送過來的學生信息，本次我們使用jquery形式的Ajax來完成

二、使用步驟

 1.引入jar

jar:
jackson-annotation.jar
jackson-core.jar
jackson-datebind.jar

如果不使用Maven，引入時要確保jar包版本一致問題，否則會引發異常

2.Person類

jar:
jackson-annotation.jar
jackson-core.jar
jackson-datebind.jar

3.前端頁面

package com.lanqiao.entity;

public class Person {
	private int id;
	private String name; 
	private int age;
	public Person() {
		super();
		// TODO Auto-generated constructor stub
	}
	public Person(int id, String name, int age) {
		super();
		this.id = id;
		this.name = name;
		this.age = age;
	}
	public int getId() {
		return id;
	}
	public void setId(int id) {
		this.id = id;
	}
	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;
	}	
}

4.Controller

<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8" language="java" isErrorPage="true"%>
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Insert title here</title>
</head>
<script type="text/javascript" src="js/jquery-3.4.1.js"></script>
<script type="text/javascript">
	$(function () {
		$("#testJson").click(function(){
			//通過Ajax請求springmvc
			$.post(
				//請求的服務器地址
				"testJson",
				//服務端處理完畢的回調函數
				function (result) {
					for(var i=0;i<result.length;i++){
						alert(result[i].id+","+result[i].name+","+result[i].age);
					}
				}
			)
		});
	});
</script>
<body>
	<input type="button" value="testJson" id="testJson">
</body>
</html>

@ResponseBody修飾的方法，會將該方法的返回值以一個json數組的形式返回給前臺,它告訴SpringMVC,此時的返回不是一個View頁面，而是一個ajax調用的返回值(Json數組)

## 5.測試

在這裡插入圖片描述

到此這篇關於SpringMVC通過Ajax處理Json數據的步驟詳解的文章就介紹到這瞭,更多相關SpringMVC處理Json數據內容請搜索WalkonNet以前的文章或繼續瀏覽下面的相關文章希望大傢以後多多支持WalkonNet！

推薦閱讀：

    None Found