什么是AJAX

分享人：曾健

1、IE浏览器下面的缓存问题

2、跨域问题

3、Ajax乱码问题

4、使用post提交的时候需要设置content-type为"application/x-www-form-urlencoded"

5、Ajax对象属性的大小写问题

6、Ajax状态为0的问题



下面一一讲解常见问题出现的原因和解决办法

第一个问题，缓存问题：
在IE浏览器下面使用get请求时，如果第一次请求了数据之后IE会自动缓存数据，如果下一次再发送同样的 请求的时候浏览器会自动先去找缓存显示出来，所以如果请求的数据有变化的时候，这里是看不到变化的。 解决办法： xhr.open("get","xxxx.aspx?_dc="+new Date().getTime(),true); 就是在请求的后面 加上_dc=。。。让url变成唯一，或者是，改成post请求。

5.编码实战

jQuery方法 
                
               $.ajax({
                    url:"student-ajax/student",
                    type:"POST",
                    dataType:"json",
                    data:{
                        name:$("#names").val(),
                        qq:$("#QQs").val(),
                    },
                    success:function(data){
                        console.log(data);
                        if(data.code === 200){
                            alert($("#names").val() + "学员信息" +data.message);
                        }else{
                            alert(data.message);
                        }
                    },
                    error:function(data){
                        console.log(data);
                        alert("添加失败");
                    }
                });
            }) ;
AngularJS方法 
                    
                    $http({
                    method:'get',
                    url:('/a/a/all/document?type=1&page='+$scope.page),
                    headers:{'Content-Type':'application/x-www-form-urlencoded'}
                })
                    .success(function (response) {
                        // console.log(12345);
                        console.log(response.total);
                        console.log(response);
                        console.log(aaa);
                        // if (response.message === "查询成功") {
                         $scope.userList = response.data;
                         $scope.userTotal = response.total;
                        $scope.page=response.page;
                        // console.log($scope.userList.total);
                    });
Javascript原生方法 
                
                  var request = new XMLHttpRequest(); // 新建XMLHttpRequest对象;
                  request.onreadystatechange = function () { // 状态发生变化时，函数被回调;
                      if (request.readyState === 4) { // 成功完成
                          // 判断响应结果:
                          if (request.status === 200) {
                              // 成功，通过responseText拿到响应的文本:
                              return success(request.responseText);
                          } else {
                              // 失败，根据响应码判断失败原因:
                              return fail(request.status);
                          }
                      } else {
                          // HTTP请求还在继续...
                      }
                  }

                  // 发送请求:
                  request.open("POST","/skill-ajax/a/login",true);
                  request.setRequestHeader("Content-type","application/x-www-form-urlencoded");
                  request.send();
                  alert('请求已发送，请等待响应...');

                // readyState值说明
                // 0,初始化,XHR对象已经创建,还未执行open
                // 1,载入,已经调用open方法,但是还没发送请求
                // 2,载入完成,请求已经发送完成
                // 3,交互,可以接收到部分数据

                // status值说明
                // 200:成功
                // 404:没有发现文件、查询或URl
                // 500:服务器产生内部错误
(2) 向服务器发送请求
(a) open(method,url,async) 规定请求的类型、URL 以及是否异步处理请求。
method：请求的类型；GET 或 POST
url：文件在服务器上的位置
async：true（异步）或 false（同步）
(b)send(string)
将请求发送到服务器。
string：仅用于 POST 请求