【博客園cnblogs筆者m-yb原創(chuàng)，轉載請加本文博客鏈接，筆者github: https://github.com/mayangbo666，公眾號aandb7，QQ群927113708】

https://www.cnblogs.com/m-yb/p/9965238.html

ajax是一種前端異步發(fā)送請求數(shù)據到后端,進行數(shù)據交互的手段,前端頁面使用ajax需要依賴jQuery的js庫.

比如前端頁面提交form表單的數(shù)據的ajax請求代碼片段示例:

點擊登錄按鈕,觸發(fā)onlick函數(shù)?login()

<script>
function login() {
$.ajax({
type: "POST",
dataType: "json",
url: "/login",
data: {
loginCode: $("#loginCode").val(),
password: $("#password").val()
},
success: function (dataResult) {
if (!dataResult.success){
alert(dataResult.message);
return false;
}
alert("登錄成功");
window.location.href = "/toMainPage";
},
error: function (XMLHttpResponse) {

}
});
}
</script>

后端的AjaxVO代碼:

public class AjaxVO {
private boolean success;private String message;private Object data;private AjaxVO(){}private AjaxVO(boolean success, String message, Object data){this.success = success;this.message = message;this.data = data;}public static AjaxVO success(){return new AjaxVO(true, null, null);} public static AjaxVO success(){
return new AjaxVO(true, null, null);
}

public static AjaxVO success(Object data){
return new AjaxVO(true, null, data);
}

public static AjaxVO failed(String message){
return new AjaxVO(false, message, null);
} public boolean isSuccess() {
return success;
}

public String getMessage() {
return message;
}

public Object getData() {
return data;
} }

使用時, 如果后端需要返回無數(shù)據體的成功狀態(tài)就調用

AjaxVO.success();

如果后端需要返回有數(shù)據體的成功狀態(tài)就調用

AjaxVO.success(Object data);

返回失敗信息: AjaxVO.failed(String message);
【注】:
需要解析json的依賴,本文使用了jackson:
需要 引入Jackson Core, Jackson Databind,Jackson Annotations三個mavenjar包依賴.

轉載于:https://www.cnblogs.com/m-yb/p/9965238.html

總結

以上是生活随笔為你收集整理的ajax请求, 前后端, 代码示例的全部內容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網站內容還不錯，歡迎將生活随笔推薦給好友。