Ajax学习记录

Ajax

1:ajax是一种页面局部刷新的技术，不是整个页面刷新。这里就像论坛评论里面的刷新，只是局部的，不是页面全部提交到服务器。

2：页面不刷新，创建个WebClient，它和服务器进行交互。<XMLHttpRequest>

3:代码

Eg:这里就是向服务器发送请求，接受请求。

1. <script type="text/javascript">
2.     function btnClick() {
3.         var xmlhttp = new ActiveXObject("Microsoft.XMLHTTP");//创建xmlhttp对象，这里相当于WebClient
4.         if(!xmlhttp) {
5.             alert("创建XML异常");
6.             return false;
7.         }
8.         xmlhttp.open("POST", "/Default/Index" + new Date(), false); //准备向服务器Default发送请求
9.         //XMLHTTP默认不是同步请求，也就是open方法并不像WebClient的DownLoadString那样，把服务器的数据拿到才返回，是异步的，因此需要监听
10.        //onreadystatechange事件
11.         xmlhttp.onreadystatechange=function() {
12.             if (xmlhttp.readyState==4) {
13.                 if (xmlhttp.status==200) { //状态码200表示成功
14.                     alert(xmlhttp.responseText);
15.                     document.getElementById("Text1").value = xmlhttp.responseText;
16.                 } else {
17.                     alert("ajax服务器返回错误");
18.                 }
19.             }
20.         }
21.         xmlhttp.send();//开始发送请求
22.     }
23. </script>

4：

在使用ajax的时候要注意里面的缓存，有可能不往服务器发送请求，可能从缓存中读取值。解决它的办法就是让每次发送的请求都不一样，加上时间。

不同的浏览器创建xmlhttp的方法是不同的。

5：Jquery里面的方法

1. function btnClick2() {
2.            var eeee = $("").val();
3.            var ddd = $("").val();
4.            $.post("GetDate.cs", { "djdhj": eeee, "": ddd }, function(data, textStates) { //post无缓存,第二个为往服务器那边传递的参数，利用的是键值对的形式
5.                alert(data);
6.                alert(textStates);
7.            });
8.        $.get(); //get这里可能有缓存
9.        $.ajax(); //post,get内部实现是调用ajax方法
10.        }

 

6:Json

Ajax传递复杂数据的时候我们必须要进行解析，但是我们使用Json来解决这个问题.

将复杂的数据按照自己的方式进行封装，在浏览器中可以转换为js可以识别的方式。

1. //这里可以得到js提交到的数据
2.           JavaScriptSerializer json=new JavaScriptSerializer();
3.           string jsons = json.Serialize(new Person() {Name = "ahui", Age = 12}); //将对象转换为json对象
4.           context.Response.Write(jsons); //输出函数

7：得到json字符串

1. $(function() {
2.            $.post("JSon.ashx", function (data, status) {
3.                var person = $.parseJSON(data);//这里得到服务器端的数据
4.                alert(person.name);
5.            });
6.        });

8:这里通过JQuery来读取服务器JSon.ashx端的返回结果，//$.post("服务器",function(data,status){});

data是服务器返回的数据,status是看可以往服务器发送不，看是否接通链路。

1. $(function() {
2.           $.post("JSon.ashx", function (data, status) {
3.               alert(data);
4.           });
5.       });

9：(全局文件)配置文件的解释

讲解Application_Start文件中的代码

我们知道Global.asax.cs是最底层的代码，每一次iis请求，都会首先执行这里的代码，且只执行一次，下面就让我们来学习下，这里的代码的具体的意思。