概念
允许浏览器与服务器通信而无需刷新当前页面的技术,不刷新整个页面只刷新部分,最鲜明的应用范围是地图。
XMLHttpRequest对象(传输前后端数据json,xml)是JavaScript扩展,Ajax是其代名词。
Ajax 与 form 表单的区别
ajax | form | 备注 | |
---|---|---|---|
趋势 | 新建请求 | 放弃本页面 | ajax在提交时,是在后台新建一个请求;from表单趋势放弃本页面,再次申请。 |
数据处理 | 使用程序 | 表单结构 | ajax在提交,请求,接收时,整个过程都是需要使用程序来对其数据进行处理;from提交时,是根据你的表单结构自动完成,不需要代码干预。 |
交互方式 | 异步 | 同步 | ajax在提交,请求,接收时,都是异步进行的,网页不需要刷新;from表单请求提交是同步进行的,哪怕是数据提交给本页面,也是需要刷新的,这样就会导致表单请求一次数据就会进行一次页面跳转,当前浏览器的屏幕会进行刷新,也就是会闪一下,会造成不好的用户体验,但是其中填写的信息也会很容易丢失,而Ajax页面不会跳转,之前填写的信息也不会消失,不用再请求一次页面。 |
实现方式 | javascript | 浏览器 | ajax必须使用js来实现,不启用js的浏览器,无法完成操作;from是浏览器的功能,无论是否开启js,都可以提交表单。 |
Ajax的使用
点击事件
$("#button").click(function () {
$.ajax({
type: "POST",
url: "/admin/sign",
contentType: 'application/x-www-form-urlencoded;charset=utf-8',
data: {
username: $("#username").val(),
password: $("#password").val()
},
dataType: "json",
success: function (data) {
console.log(data.responseText);
},
error: function (e) {
console.log(e);
}
});
});