- JQUery封装了一个函数,称之为$.ajax()函数,通过对象调用ajax函数,可以异步加载相关的请求。依靠的是Javascript提供的一个对象XHR,封装了这个对象
- AJAX 是与服务器交换数据并更新部分网页的技术,在不重新加载整个页面的情况下。
使用方式:语法结构:需要传递一个方法体作为方法的参数来使用,一对大括号称之为方法体。
ajax接收多个参数,之间用逗号间隔,每一组参数之间用冒号分割,参数的组成部分一个是参数名称(不能随便定义),是参数的值,参数的值要求是用字符串来标识。参数的声明顺序没要求
$.sjax({
url:"",
type:"",
data:"",
dataType:"",
success: function(){
},
error:function(){
}
});
参数 | 功能描述 |
---|---|
url | 表示请求的地址(url地址),不能包含参数列表 的部分内容。例如:url:“localhost:8080/users/reg” |
type | 请求的类型(get、post) |
data | 向指定的请求url地址提交的数据。例如:data:“username=tom&pwd=1234” |
dataType | 提交的数据类型。数据的类型一般指定为json类型。dataType:“json” |
success | 当服务器正常响应客户端时,会自动调用success参数的方法,并且将服务器返回的数据以参数形式传递给这个方法的参数上 |
error | 当服务器未正常响应客户端时,会自动调用error参数的方法,并且将服务器返回的数据以参数形式传递给这个方法的参数上 |
js代码可以独立存放在一个js的文件里或者声明在一个script标签中
<script type="text/javascript">
//1、监听注册按钮是否被点击,如果被点击可以执行一个方法
$("btn-reg").click(function () {
console.log($("#form-reg").serialize());
//2、发送ajax()的异步请求来完成用户的注册功能
$.ajax({
url: "/users/reg",
type: "POST",
data: $("#form-reg").serialize(),
dataType: "JSON",
success: function (json) {
if (json.state == 200){
alert("注册成功")
}else {
alert("注册失败")
}
},
error: function (xhr) {
alert("注册时产生未知的错误!"+xhr.status)
}
})
})
</script>