Ajax学习——jQuery下的post和get请求

“要点”

1. jQuery下的post，get请求
2. 常用的jQuery的AJAX方法

---

jQuery下的post，get请求
jQuery对Ajax进行了封装，更加方便了我对对Ajax的使用，下面是jQuery的post，get，ajax的例子

$.ajax(url,[setting])
jQuery 底层 AJAX 实现。简单易用的高层实现见 $.get, $.post 等。$.ajax() 返回其创建的 XMLHttpRequest 对象。大多数情况下你无需直接操作该函数，除非你需要操作不常用的选项，以获得更多的灵活性。常用的几个属性在下面的代码中给出，详细的可参考jQuery手册
常用参数说明

• url:待载入页面的URL地址
• data:待发送 Key/value 参数。
• success:载入成功时回调函数。
• type:返回内容格式，xml, html, script, json, text, _default

$.get(url,[data],[callback],[type])
参数说明

• url:待载入页面的URL地址
• data:待发送 Key/value 参数。
• callback:载入成功时回调函数。
• type:返回内容格式，xml, html, script, json, text, _default。

$.post(url,[data],[callback],[type])
参数说明

• url:待载入页面的URL地址
• data:待发送 Key/value 参数。
• callback:载入成功时回调函数。
• type:返回内容格式，xml, html, script, json, text, _default。
• 列表内容

     //AJAX GET请求
     //对GetDate按钮添加click事件，向GetDate.ashx发送get请求
            $("#GetDate").click(function () {
                $.get("GetDate.ashx", { "name": "dfghjk", "namae": "123" }, function (date) {
                    alert(date);//GetDate.ashx返回当前时间
                });


            })
            //AJAX POST请求 对PostDate按钮添加click事件，向GetDate.ashx发送get请求
            $("#PostDate").click(function () {
                $.post("GetName.ashx", { "name": 123, "sh": "123456" }, function (da) {
                    alert(da);//GetName.ashx返回传递的Name的值123
                });
            })
            //AJAX
            $("#AJAX").click(function () {
                $.ajax({
                    type : "post",
                    url: "GetDate.ashx",
                    data: "name=nihao&tyu=sad",
                    success: function (msg) {
                    //数据成功返回时执行次回调函数
                        alert(msg);
                    }
                })

            })

---

常用的jQuery的AJAX方法
$.load(url,[data,[callback]])
作用：
参数说明

• url:待装入 HTML 网页网址。
• data:发送至服务器的 key/value 数据。
• callback:载入成功时回调函数。

$.getJSON( url,[data],[callback])
作用：通过 HTTP GET 请求载入 JSON 数据。

• url:待装入 HTML 网页网址。
• data:发送至服务器的 key/value 数据。
• callback:载入成功时回调函数。

$.getScript(url,[callback])
作用：通过 HTTP GET 请求载入并执行一个 JavaScript 文件

• url:待装入 HTML 网页网址。
• callback:载入成功时回调函数。

$(“elem”).serialize()
作用：返回序列表表格内容，是一个string类型

$(“elem”).serializeArray()
作用：序列化表格元素 (类似 ‘.serialize()’ 方法) 返回 JSON 数据结构数据。
注意：此方法返回的是JSON对象而非JSON字符串，返回的JSON对象是由一个对象数组组成的

下面给出使用的简单例子

  <script type="text/javascript">

        $(function () {
          //load方法，在mydiv中加载JsonUinfoList.html文件，并且再加载完后执行回调函数，
          //注意！！！加载完后是不会执行JsonUinfoList.html里面的js代码
            $("#mydiv").load("/jsonDemo/JsonUinfoList.html", function () { alert("OK!") });
        });
          // getJSON方法 获得json对象中的users对象数组，并将index为1的name属性输出
           $.getJSON("GetJSON.ashx", {name : "tom" , age : 12 } ， function(json){
           alert("name : " + json.users[1].name);
});
         //加载并且执行Display.js文件中的代码，成功后执行回调函数
        $.getScript("Display.js"，funvtion() { alert("OK!")} );

         //把userdorm中的用户信息转成json对象
            var jsondata = $("#UserForm").serializeArray();

    </script>

---

PS:博文中如有什么不对的地方恳请大家指出，谢谢~