AJAX

1、AJAX= 异步 JavaScript 和 XML。实现不加载新页面的前提下更新页面。

 

2、工作原理：

　

　　浏览器首先触发事件，创建一个XMLHttpRequest对象，发送Http请求，通过网络到达服务器，服务器处理Http请求，然后创建一个回复发送数据到浏览器，通过网络回到浏览器，浏览器利用JavaScript处理返回的数据，更新页面文本。

 

3、AJAX的基础就是XMLHttpRequest（XHR），XMLHttpRequest用于在后台与服务器进行数据传递，因此无需再次加载新的页面

　　【1】、创建XMLHttpRequest对象

　　　　浏览器会在内部自己创建XMLHttpRequest对象。

variable=new XMLHttpRequest();

　　【2】、向服务器发送请求

　　　　如果需要向服务器发送请求，可以使用open和send方法。

　　　　XMLHttpRequest 对象如果要用于 AJAX 的话，其 open() 方法的 async 参数必须设置为 true：

xmlhttp.open("GET","ajax_info.txt",true);//（方式，url，是否使用异步async参数）
xmlhttp.send();

　　【3】、服务器相应

如果是XML格式的就用responseXML

 document.getElementById("myDiv").innerHTML=xmlhttp.responseText;

 

4、以上是AJAX本本身的技术，jquery中有.ajax()方法，可以更简单的使用ajax技术进行前后端数据的异步传输。

　　其中重要的参数有：

　　　　1、url：指前端数据向后端传输的后端接收地址

　　　　2、date：指前端向后端传送的数据

　　　　3、type：指前端向后端传输的method（post和get）

　　　　4、dateType：指后端向前端传返回值的数据类型（text    text josn等）

　　　　5、success：通常里面是一个函数function（date）{}，data为返回的数据，在方法体内写如何处理返回值。

实例：

前端：

var url = "/test/check";
    $.ajax({
        type: "post",
        url: url,
//      data: "para="+para,  此处data可以为 a=1&b=2类型的字符串 或 json数据。
        data: {"para":1},//json类型
        cache: false,
        async : false,
        dataType: "json",
        success: function (data ,textStatus, jqXHR)
        {
            if("true"==data.flag){
               alert("合法！");
                return true;
            }else{
                alert("不合法！错误信息如下："+data.errorMsg);
                return false;
            }
        },
        error:function (XMLHttpRequest, textStatus, errorThrown) {      
            alert("请求失败！");
        }
     });

后端：

/**
     * 校验
     *
     * @return void
     */
    public void check(){
        Map<String,String> result = new HashMap<String,String>();//使用hashmap来接收json对
        boolean flag = false;
        try{
            String para= getPara("para");//在servlet中使用reqest.getparameter("para")方法来获取前端参数。

　　　　　　//校验 代码...
            result.put("flag", "true");
            renderJson(result);//返回json数据
        }catch(Exception e){
            result.put("flag", flag+"");
            result.put("errorMsg", e.getMessage());
            renderJson(result);//返回json数据
            e.printStackTrace();
        }
    }

 使用servlet的话，后端这样响应：

List<Map<String,Object>> list = bo.selectData();
response.setContentType("application/json;charset=GBK");
PrintWriter out=response.getWriter();       
out.write(JSONArray.fromObject(list).toString());//使用alibaba的fastjson的话用JSON.tojson()方法
out.flush();
out.close();