jQuery中的Ajax应用

1,Ajax概念:是一种广泛应用在浏览器的网页开发技术，是JavaScript、XML、XMLHttpRequest等技术的综合应用。

2,Ajax的优点:a、不需要任何浏览器插件，在任何支持Javascrtipt的浏览器上运行

　　　　　　 b,优秀的用户体验

　　　　　　 c,提高Web程序的性能

　　　　　　 d,减轻服务器和宽带的负担

3,Ajax缺点:a,它可能破坏浏览器后退按钮的正常行为

　　　　　　b,搜索引擎的支持不足

　　　　　　c,开发和调试工具的缺乏

　　　　　　d,手机设备支持性差

4,XMLHttpRequest对象是Ajax的核心对象，Ajax利用它来发送异步请求、接受响应及执行回调

5,属性:a、readyState:HTTP请求的状态，常用表示HTTP响应已经完全接受的值

　　　b、responseText:服务器响应体（不包括头部）

　　   c、responseXML:服务器响应XML文件到客服端

　　　d、status:HTTP状态代码，200表示成功，404表示没有找到资源，500表示服务器错误

6,方法:a,abort():取消当前响应

　　　　b,open(method,url,async):method(请求的HTTP方法)，url(请求的的路径)，Async(是否异步)

　　　　c、send():发送HTTP请求，使用传递给open()方法的参数

　　　　d、setRequestHeader(name,value):添加一个HTTP请求的头部

7,

 document.getElementById("Button1").onclick = function () {
            //（1）创建httprequest请求对象
            var http = new XMLHttpRequest();
            //(2)打开链接
            http.open("get", "http://localhost:2498/Handler1.ashx");
            //(3)监控状态的返回
            http.onreadystatechange = function () {
                if (http.status == 200 && http.readyState == 4) {
                    alert(http.responseText);
                }
            }
            //(4)发送请求帮助
            http.send();
        }

8 ,

 $(function () {
            $("#Button1").click(function () {
                $.ajax({ 
                    url: "http://localhost:1622/Handler1.ashx",
                    type: "get",
                    data:{"name":"张柳英","age":"20","sex":"男"},
                    dataType: "text",
                    success: function (date) {
                        alert(date);
                    }
                })
            });
        });

9,

 $(function () {
            $("#BtnSubmit").click(function () {
                $.get("Handler1.ashx", {
                    username: $("#txtUsername").val(),
                    contact: $("#txtContact").val(),
                    message: $("#txtmessage").val()
                },
                function (date, textStatus) {
                //data成功后服务器端返回的数据，格式是xml，json，html等
                    $("#divContent").append(date);
                    //textStatus参数（可省）为请求状态：success,errornotmodified,timeout等四种状态
                    alert("留言成功");
                }
                )
            })
        });




context.Response.ContentType = "text/plain";
            //context.Response.Write("Hello World");
            string username = context.Request.QueryString["username"];
            string contact = context.Request.QueryString["contact"];
            string message = context.Request.QueryString["message"];
            System.Text.StringBuilder sb = new System.Text.StringBuilder();
            sb.Append("<div><ul>");
            sb.Append("<li>留言人：" + username + "</li>");
            sb.Append("<li>留言：" + message + "</li>");
            sb.Append("</ul><hr/></div>");
            context.Response.Write(sb.ToString());

10,区别：$.get()是使用get方式，而$.post()方式是使用post方式，其要使用get方式，需将参数跟在url后进行传递

11,type为返回内容格式，xml,html,script,json,text,_default

12,回调函数方法的三个参数：responseText(服务器响应内容)，textStatus(请求状态)，XMLHttpRequest对象