Jquery Ajax

简单介绍ajax

AJAX:”Asynchronous JavaScript and XML”

中文意思：异步JavaScript和XML。

指一种创建交互式网页应用的网页开发技术。

 （目前来说ajax还是一门单线程语言）不能异步执行js代码，XMLHttpRequest 是ajax的核心对象，

不是指一种单一的技术，而是有机地利用了一系列相关的技术：

简单理解为：JavaScript + XMLHttpRequest + CSS +服务器端 的集合. 

 

l使用XMLHttpRequest对象

按照下面模式，可以同步地XMLHttpRequest对象： 

1.创建对象； - new  XMLHttpRequest

2.创建请求； - open (初始化，xhr对象。告诉他要去做的事情)

3.发送请求； - send (发送请求（告诉浏览器开启一个异步请求。），去吧)

 

 

l为XMLHttpRequest对象设置请求参数

      1.GET方式

            1.1设置参数

            xhr.open("GET", "GetAreasByAjax.ashx?isAjax=1", true);

     1.2GET方式请求可以设置浏览器不使用缓存
xhr.setRequestHeader("If-Modified-Since", "0");

            1.3发送: xhr.send(null);//GET方式

2.POST方式：
       1.1设置参数：xhr.open("POST", "GetAreasByAjax.aspx", true);
       1.2添加请求头：xhr.setRequestHeader("Content-Type", "application/x-www-form-urlencoded");

            1.3发送：xhr.send("isAjax=1&na=123");//POST方式

 

            function createXmlHttp() {//创建xhr对象
                var xhobj = false;
                try {
                    xhobj = new ActiveXObject("Msxml2.XMLHTTP"); // ie msxml3.0+
                } catch (e) {
                    try {
                        xhobj = new ActiveXObject("Microsoft.XMLHTTP"); //ie msxml2.6
                    } catch (e2) {
                        xhobj = false;
                    }
                }
                if (!xhobj && typeof XMLHttpRequest != 'undefined') {// Firefox, Opera 8.0+, Safari
                    xhobj = new XMLHttpRequest();
                }
                return xhobj;
            }

 

 

1、JQUERY.AJAX(URL,[SETTINGS])

url:一个用来包含发送请求的URL字符串。

settings:AJAX 请求设置。所有选项都是可选的。

2、JQUERY.GET(URL,[data],[callback],[type])

url:待载入页面的URL地址

data:待发送 Key/value 参数。

callback:载入成功时回调函数。

type:返回内容格式，xml, html, script, json, text, _default。

示例：

$.get("test.ashx", { name: "John", time: "2pm" }, function(data){

alert("Data Loaded: " + data);

});

3、JQUERY.GETJSON(URL,[data],[callback])

通过 HTTP GET 请求载入 JSON 数据。

url:发送请求地址。

data:待发送 Key/value 参数。

callback:载入成功时回调函数。

示例：

$.getJSON("test.ashx", { name: "John", time: "2pm" }, function(json){

  alert("JSON Data: " + json.users[3].name);

});

4、JQUERY.POST(URL,[data],[callback],[type])

通过远程 HTTP POST 请求载入信息。

这是一个简单的 POST 请求功能以取代复杂 $.ajax 。请求成功时可调用回调函数。如果需要在出错时执行函数，请使用 $.ajax。

url:发送请求地址。

data:待发送 Key/value 参数。

callback:发送成功时回调函数。

type:返回内容格式，xml, html, script, json, text, _default。

示例：

$.post("test.ashx", { "func": "getNameAndTime" },function(data){

     alert(data.name);

   }, "json");