ajax手记

1 使用load()方法 异步请求数据
使用load() 方法通过ajax请求加载服务器中的数据，
并把返回的数据放置在指定元素中，调用格式如下

load(url,[data],[callback])

<script type="text/javascript">
$(function(){

$(#id).bind("click",function(){
var $this=$(this);
$("ul").html("<img src='' alt=''/>").load("http://....."),

function(){

$this.attr("disabled","true");

});

})

}
);


</script>

2使用getJSON()方法异步加载JSON格式数据
使用getJSON()方法可以通过Ajax异步请求的方式，获取服务器中的数据，并对获取的数据进行解析，显示在页面中，它的调用格式为：

jQuery.getJSON(url,[data],[callback])
或$.getJSON(url,[data],[callback])

$.getJSON("http://www.imooc.com/data/sport.json",function(data){
                        $this.attr("disabled", "true");
                        $.each(data, function (index, sport) {
                            if(index==2)
                            $("ul").append("<li>" + sport["name"] + "</li>");
                        });

使用getScript()方法异步加载并执行js文件
使用get()方法以GET方式从服务器获取数据
使用post()方法以POST方式从服务器发送数据
使用serialize()方法序列化表单元素值
使用ajaxSetup()方法设置全局Ajax默认选项
使用ajaxStart()和ajaxStop()方法
使用ajax()方法加载服务器数据

 $.ajax({
                    url: "http://www.imooc.com/data/check.php",
                    data: { num: $("#txtNumber").val() },
                    type: "post",
                    success: function (data) {
                        $("ul").append("<li>你输入的<b>  " + $("#txtNumber").val() + " </b>是<b> " + data + " </b></li>");
                    }
                });

 <div id="divtest">
            <div class="title">
                <span class="fl">加载一段文字</span> 
                <span class="fr">
                    <input id="btnShow" type="button" value="加载" />
                </span>
            </div>
            <ul>
               <li id="divload"></li>
            </ul>
        </div>

        <script type="text/javascript">
            $(function () {
                $("#divload").ajaxStart(function(){
                    $(this).html("正在请求数据...")
                });
                $("#divload").ajaxStop(function(){
                    $(this).html("数据请求完成！");
                });
                $("#btnShow").bind("click", function () {
                    var $this = $(this);
                    $.ajax({
                        url: "http://www.imooc.com/data/info_f.php",
                        dataType: "json",
                        success: function (data) {
                            $this.attr("disabled", "true");
                        $("ul").append("<li>我的名字叫：" + data.name + "</li>");
                        $("ul").append("<li>男朋友对我说：" + data.say + "</li>");
                        }
                    });
                })
            });
        </script>

最后一个例子

 <ul></ul>
        <script type="text/javascript">
            var stus = [{
                "name":"寂寞",
                "age":"32",
                "sex":"male"
            },{
                "name":"寂寞",
                "age":"32",
                "sex":"male"
            }];
            $.each(stus,function(index,stu){
                $("ul").append("<li>"+stu.name+"</li>")    
            })
        </script>

看 有飞机