JQ异步调用

　　AjaxGet请求方式：

<script type="text/javascript">
    $.ajax({
        type: "GET",
        dataType: "html",
        url: "test.htm",
        data: {}, //参数信息，采用ＪＳ对象的形式，也可以使用URL地址比较传统的&将参数分隔
        error: function () {
            alert("获取数据失败");
        },
        beforeSend: function () {
            alert("发送请求之前出现错误");
        },
        success: function (data) {
            $("#list").html(data)
        }
    });
</script>

test.htm文档内容：

<ul>
<li>data:td</li>
<li>infomation:ok</li>
</ul>

Post请求操作数据：

 $.ajax({
        type: 'POST',
        data: { name: 'td', email: 'td@qq.com', addr: 'china' },
        url: '/ajax/insert.ashx',//一般处理程序
        success: function (data) {
            if (data.res) {
                alert('操作成功');
            }
        }
    });

注意：AJAX可以跨域发GET请求，来读取数据，但不可以发POST请求,因为这样不安全

ajax跨域Get请求：

  $.ajax({
        type: 'GET',
        dataType: 'jsonp',
        jsonp: "jsonpcallback", //需要与服务端的jsonp字符匹配
        url: 'http://www.baidu.com/ajax/test.',
        success: function (data) {
            $('#result').html(data);
        }
    });

 

简写形式：

1 远程载入html文件并插入DOM中

 $("#load").load("ajaxData.htm");

2 $.get()向指定页面发Get请求

  $.get("ajaxData.htm", function (data) {
            $("#gets").html(data);
        }, "html");

3 $.getJSON()　从指定页面获取JSON对象

    $.getJSON("json.js", function (json) {
        alert("OK");
        $("#getjsons").attr({ "src": json[0].src, "alt": json[0].alt });
    });

4 $.getScript()　装载指定js文件

 $.getScript("img.js", function () { alert("img.js装载成功！") });

5 $.post()　向指定页面发post请求

 $.post("test.ashx", { name: "John", time: "2pm" }); //普通参数
 $.post("test.ashx", $("#testform").serialize()); //表单参数（序列化表单参数，实现上把参数用&分开的）

6 序列化表单元素

$("form").serialize()

7 序列化表格元素返回 JSON 数据结构数据

console.log($("form").serializeArray());