为了账号安全,请及时绑定邮箱和手机立即绑定

jQuery学习笔记(ajax)

2017.03.31 11:12 4433浏览

1、$.getJSON(url,[data],[callback])

   $.getJSON("url",function (data){
         $this.attr("disabled", "true");                   
          $.each(data, function (index, arr) {
                  $("ul").append("<li>" + arr["name"] + "</li>");
          });
 });

可以用each遍历一下;

2、$get("url",function(data){},"json")

设置从服务器获取数据的类型,所以得到的数据格式为json类型的。
默认get从服务器获取到的数据是 字符串类型

第一不要忘了后面的json

第二不要忘了加引号

3、使用serialize()方法序列化表单元素值

$("form").serialize()
//将表单中有name属性的元素值进行序列化,生成标准URL编码文本字符串
Text=name&Select=0&Checkbox=on

4、使用ajaxSetup()方法设置全局Ajax默认选项

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

几个ajax同时调用,取出来一起公共部分

5、使用ajaxStart()和ajaxStop()方法

ajaxStart()和ajaxStop()方法是绑定Ajax事件。ajaxStart()方法用于在Ajax请求发出前触发函数,ajaxStop()方法用于在Ajax请求完成后触发函数。它们的调用格式为:

$(selector).ajaxStart(function())和$(selector).ajaxStop(function())

其中,两个方法中括号都是绑定的函数,当发送Ajax请求前执行ajaxStart()方法绑定的函数,请求成功后,执行ajaxStop ()方法绑定的函数。

比如用在加载数据之初有什么动画,结束消失

6、拖曳插件——draggable

拖曳插件draggable的功能是拖动被绑定的元素,当这个jQuery UI插件与元素绑定后,可以通过调用draggable()方法,实现各种拖曳元素的效果,调用格式如下:

$(selector). draggable({options})

options参数为方法调用时的配置对象,根据该对象可以设置各种拖曳效果,如“containment”属性指定拖曳区域,“axis”属性设置拖曳时的坐标方向。

        <script type="text/javascript">
            $(function () {
                $("#x").draggable({containment:"parent",axis:"x"});
                $("#y").draggable({containment:"parent",axis:"y"});
            });
        </script>
点击查看更多内容
35人点赞

若觉得本文不错,就分享一下吧!

评论

相关文章推荐

正在加载中
意见反馈 帮助中心 APP下载
官方微信

举报

0/150
提交
取消