• jQuery使用ajaxStart()和ajaxStop()方法


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

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

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

    例如,在调用ajax()方法请求服务器数据前,使用动画显示正在加载中,当请求成功后,该动画自动隐藏,如下图所示:

    在浏览器中显示的效果:

    从图中可以看出,由于使用ajaxStart()ajaxStop()方法绑定了动画元素,因此,在开始发送Ajax请求时,元素显示,请求完成时,动画元素自动隐藏。

    注意:该方法在1.8.2下使用是正常的

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"
    <html xmlns="http://www.w3.org/1999/xhtml"
        <head> 
            <title>使用ajaxStart()和ajaxStop()方法</title> 
            <script src="http://libs.baidu.com/jquery/1.8.2/jquery.js" type="text/javascript"></script> 
            <link href="style.css" rel="stylesheet" type="text/css" /> 
        </head> 
        
        <body> 
            <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> 
        </body> 
    </html>

  • 相关阅读:
    Git ignore file for Xcode projects
    How can I create a zip archive of a whole directory via terminal without hidden files?
    What is a bare git repository?
    How to tell if UIViewController's view is visible
    Adding A Shadow To UIView
    Properties
    iOS中nil,Nil,NULL之间的区别
    FMDB的简单使用
    iOS 加载图片选择imageNamed 方法还是 imageWithContentsOfFile?
    对retain 和 assign的理解
  • 原文地址:https://www.cnblogs.com/pcyy/p/5454603.html
Copyright © 2020-2023  润新知