AJAX

1.什么是AJAX？

　　Ajax 即“Asynchronous Javascript And XML”（异步 JavaScript 和 XML），是指一种创建交互式网页应用的网页开发技术。

　　Ajax = 异步 JavaScript和 XML 或者是 HTML（标准通用标记语言的子集）。

　　Ajax 是一种在无需重新加载整个网页的情况下，能够更新部分网页的技术。

　　通过在后台与服务器进行少量数据交换，Ajax 可以使网页实现异步更新。这意味着可以在不重新加载整个网页的情况下，对网页的某部分进行更新。（页面无刷新，异步请求）

2.为什么要使用AJAX？

　　传统的网页（不使用 Ajax）如果需要更新内容，必须重载整个网页页面。这样难免浪费资源，可能多次请求同一个页面资源。

　　然而AJAX只需要最开始请求下页面，之后所有的数据交互都无需重新加载当前页面。

3.AJAX的应用场景？

　　注册---》用户名的唯一性校验
　　注册---》 注册提交
　　注册---》注册验证码
　　登陆---》 登录提交等等

　　注意：什么场景中适合使用ajax模式？什么场景中适用传统模式？

　　发送请求需要绝对跳转的时候使用传统模式！！！

4.AJAX的使用？

例：注册用户名的唯一性校验

用户：输入用户名 然后输入完毕 立刻提交用户名是否可用
　　1 给 id为username的输入框添加失去焦点的事件
　　　　username.onblur = function () {
　　　　　　alert(111);
　　　　}
　　2 获取用户输入的数据value
　　　　this.value
　　3 通过ajax将用户输入的用户名发送给服务器（servlet）
　　　　3.1 将 jQuery文件导入到 views/js
　　　　3.2 在当前文件中通过script标签引入jq文件
　　　　3.3 发送ajax请求
　　　　　　$.get();
　　　　　　$.post();
　　　　　　$.post("url",参数,function(){});
　　4 接收服务器返回的响应（该用户名是否可用）
　　5 将回传的响应展示到页面中
　　　　后台（servlet）：1 接收请求参数
　　　　　　　　　　　　2 通过dao 校验用户名是否可用
　　　　　　　　　　　　3 将校验结果 响应给浏览器

register.jsp：

　　AJAX发送json格式的数据：

CheckusernameServlet.java

　　后台响应json格式的数据

/*校验用户名唯一性*/
@WebServlet("/checkUsername")
public class CheckusernameServlet extends HttpServlet {
    @Override
    protected void service(HttpServletRequest req, HttpServletResponse resp) throws ServletException, IOException {
        /*获取请求参数*/
        String username = req.getParameter("username");
        //System.out.println(username);
        /*调用dao，校验用户唯一性*/
        ILoginDAO dao =new LoginDAOImpl();
        boolean exist = dao.isExist(username);
        /*校验结果返回浏览器 ,响应ajax请求*/
        // json格式 在 类似于java 中的 map相似  所以 先创建一个hashmap 将数据放到map中 然后 再通过 fastjson 将map转成 json
        resp.setContentType("text/json;charset=UTF-8");
        PrintWriter out = resp.getWriter();

        Map<Object, Object> map = new HashMap<>();

        if (exist){
            map.put("code","100404");
            map.put("message","用户名已被占用");
        }else {
            map.put("code","100200");
            map.put("message","用户名可用");
        }
        String s = JSON.toJSONString(map);

        out.write(s);
        out.close();

    }
}

注：AJAX发送请求到后台是json格式的数据，后台响应AJAX的也是json格式的数据。

　　响应AJAX需要导入阿里巴巴的fastjson..jar包,到工程WEN-INF/lib目录下。