1、什么是Ajax?
Ajax 即"Asynchronous Javascript And XML"（异步 JavaScript 和 XML），是指一种创建交互式网页应用的网页开发技术。Ajax = 异步 JavaScript 和 XML（标准通用标记语言的子集）。通过在后台与服务器进行少量数据交换，
Ajax 可以使网页实现异步更新。这意味着可以在不重新加载整个网页的情况下，对网页的某部分进行更新。传统的网页（不使用 Ajax）如果需要更新内容，必须重载整个网页页面。
简单来说：Ajax就是异步加载,局部刷新
2、JQuery的ajax：底层封装了JS的ajax代码，做了浏览器的兼容性。
程序员仅需要调用简单的JQ的AJAX方法，就可以实现复杂的AJAX功能。
- 少量代码，实现复杂功能
- 浏览器兼容性好，一处编写，处处执行
3、应用场景
注册重名验证
自动补全等
4、同步和异步的区别
同步方式发送请求
发送一个请求，需要等待响应返回，然后才能够发送下一个请求。
如果该请求没有响应，不能发送下一个请求，客户端会处于一直等待过程中。
异步方式发送请求
发送一个请求，不需要等待响应返回，随时可以再发送下一个请求，即不需要等待。
5、第一种方式
$(function(){ $("#username").blur(function(){ //发送请求,进行验证,验证用户名是否存在 //1.创建xmlhttpRequest对象 var request = new XMLHttpRequest(); //2.获取连接 //参数:1.请求方式2.请求的路径是否以异步方式提交 request.open("post","login1",true); request.setRequestHeader("Content-Type","application/x-www-form-urlencoded") //3.发送请求 request.send("username="+this.value); //4.获取响应的文本 //监听readystate值的改变你事件 request.onreadystatechange = function(){ //当readyState为4时,表示请求结束 if(request.readyState == 4){ //获取响应的文本 var msg = request.responseText; if(msg == "恭喜你，该用户名可以使用"){ $("#span1").css("color","green").html(msg); }else{ $("#span1").css("color","red").html(msg); } } } }); });
第二种方式 .ajax()
$(function(){ //ajax中各个参数之间用，隔开 $("#username").blur(function(){ $.ajax({ type:"get", //请求类型 url:"login1", //请求路径 data:"username="+this.value, //请求参数 dataType:"text", //预期返回的数据类型 success:function(res){ //请求成功时的回调函数，参数为返回的文本内容 if(res == "恭喜你，该用户名可以使用"){ $("#span1").css("color","green").html(res); }else{ $("#span1").css("color","red").html(res); } } }); }); });
第三种方式
$(function(){ $("#username").blur(function(){ $.post("login1?mark=check", {username:this.value}, function(res){ if(res == "恭喜你，该用户名可以使用"){ $("#span1").css("color","green").html(res); $("#sub").prop("disabled",false); }else{ $("#span1").css("color","red").html(res); $("#sub").prop("disabled",true); } }, "text" ); }); })
发请求时使用：post的四个参数详解
url : 请求路径。 向某个路径发送请求。 字符串【必填字段】
data : 发送请求时的参数列表。 【可以忽略】
格式1：{k1: "v1",k2: "v2",k3: "v3"…….. }
例如：{username: "张三",password: "123",sex: "man" }
最终拼接成：username=张三&password=123&sex=man
格式2：{"k1": "v1","k2": "v2","k3": "v3"…….. }
例如：{"username": "张三","password": "123","sex": "man" }
最终拼接成：username=张三&password=123&sex=man
目前，使用ajax提交数据时，后台仍然可用getParameter(),getParameterValues(),getParameterMap()
但是获取的参数名一定要和 data中key名对应，和表单输入项name属性无关
callback : 响应成功的回调函数。【可以忽略】
ajax局部刷新发生在回调函数中。
该回调函数仅在响应成功并且响应状态码200时，才会调用
格式：
function(data){
//data 响应体文本
}
type : 设置响应体的类型。（要求，服务器不设置响应体类型）【可以忽略】
xml, html, script, json, text, _default
type默认值：html代码
type常用值：html,json
JSON的简介
JSON是一种轻量级的数据交换格式。JSON采用完全独立于语言的文本格式，就是说不同的编程语言JSON数据是一致的。
JSON的语法格式
JSON要求一个特殊的格式:
- 以”{”开始,以”}”结束.
- 对象中的属性名和属性值使用”:”分割,
- 多个属性之间,使用”,”风格
- 使用[]表示一个对象的数组.
JSON的工具包
Jackson fastjson(阿里) gson(谷歌)
都可以将对象和json格式的字符串进行相互的转化.
这里使用的是fastjson
对象转为字符串:
JSON.toJSONString(Object obj);
字符串转为对象:
JSON.parseObject(String,Class);
