ajax请求，前后端，JavaScript与java代码示例

本文为本公众号作者原创，首发于博客园，笔名[m-yb]。

ajax是一种前端异步发送请求数据到后端,进行数据交互的手段,前端页面使用ajax需要依赖jQuery的js库.

比如前端页面提交form表单的数据的ajax请求代码片段示例:

点击登录按钮,触发onlick函数 login()

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("登录成功");

}

//,

// error: function (XMLHttpResponse) {

//}

});

}

后端的AjaxVO代码示例:

public class AjaxVO {

private boolean success;

private String message;

private Object data;

private AjaxVO(){

}

private AjaxVO(boolean isSuccess, 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;

}

}

使用时, 如果后端需要返回无数据体的成功状态就调用

AjaxVO.success();

如果后端需要返回有数据体的成功状态就调用

AjaxVO.success(Object data);

返回失败信息:

AjaxVO.failed(String message);

【注】:

需要解析json的依赖,本文使用了jackson:

需要 引入Jackson Core, Jackson Databind,Jackson Annotations三个mavenjar包依赖.