中文字幕av专区_日韩电影在线播放_精品国产精品久久一区免费式_av在线免费观看网站

溫馨提示×

溫馨提示×

您好,登錄后才能下訂單哦!

密碼登錄×
登錄注冊×
其他方式登錄
點擊 登錄注冊 即表示同意《億速云用戶服務條款》

Jquery回調對象與延遲對象怎么使用

發布時間:2022-05-31 13:40:59 來源:億速云 閱讀:114 作者:iii 欄目:開發技術

這篇文章主要介紹“Jquery回調對象與延遲對象怎么使用”,在日常操作中,相信很多人在Jquery回調對象與延遲對象怎么使用問題上存在疑惑,小編查閱了各式資料,整理出簡單好用的操作方法,希望對大家解答”Jquery回調對象與延遲對象怎么使用”的疑惑有所幫助!接下來,請跟著小編一起來學習吧!

一、回調對象Callbacks

jQuery 1.7 版本中新增的 jQuery.Callbacks() 函數,返回一個多功能對象,此對象提供了一種強大的方法來管理回調列表。它能夠增加、刪除、觸發、禁用回調函數。

1、定義和用法

$.Callbacks() 指一個多用途的回調函數列表對象,提供了一種強大的方法來管理回調函數列對。

提示: $.Callbacks 是在 jQuery 內部使用,如為 .ajax,$.Deferred 等組件提供基礎功能的函數。它也可以用在類似功能的一些組件中,如自己開發的插件。

$(function () { 
    function fn1( value ) {
        alert( value );
    }
    function fn2( value ) {
        fn1("fn2 says: " + value);
        return false;
    }
    var callbacks = $.Callbacks();
    callbacks.add( fn1 );    
    callbacks.fire( "foo!" );// 輸出: foo!    
    callbacks.add( fn2 );
    callbacks.fire( "bar!" );// 先執行f1,再執行f2。輸出: bar!, fn2 says: bar!
})

2、支持的 Flags 參數

這個 flags 參數是 $.Callbacks() 的一個可選參數, 結構為一個用空格標記分隔的標志可選列表,用來改變回調列表中的行為 (比如. $.Callbacks( 'unique stopOnFalse' ))。 
以下是可用的 flags:

  • once:確保這個回調列表只執行一次

  • memory:緩存上一次fire時的參數值,當add()添加回調函數時,直接用上一次的參數值立刻調用新加入的回調函數

  • unique:一個回調只會被添加一次,不會重復添加

  • stopOnFalse:某個回調函數返回false之后中斷后面的回調函數

下面是 $.Callbacks( "unique" ) 的一個例子

$(function () { 
    function fn1( value ) {
        alert( value );
    }
    function fn2( value ) {
        fn1("fn2 says: " + value);
        return false;
    }
    var callbacks = $.Callbacks( "unique" );
    callbacks.add( fn1 );
    callbacks.fire( "foo" );
    callbacks.add( fn1 ); // repeat addition
    callbacks.add( fn2 );
    callbacks.fire( "bar" );
    callbacks.remove( fn2 );
    callbacks.fire( "foobar" );
    /*輸出:
    foo
    bar
    fn2 says:bar
    foobar
    */
})

$.Callbacks() 支持一個列表設置多個flags(標識)而不僅僅是一個,有一個累積效應,類似"&&"。 
下面是 $.Callbacks( 'unique memory' ) 的一個例子

$(function () { 
    function fn1( value ) {
        alert( value );
        return false;
    }
     
    function fn2( value ) {
        fn1( "fn2 says: " + value );
        return false;
    } 
    var callbacks = $.Callbacks( "unique memory" );
    callbacks.add( fn1 );
    callbacks.fire( "foo" );
    callbacks.add( fn1 ); // repeat addition
    callbacks.add( fn2 );
    callbacks.fire( "bar" );
    callbacks.add( fn2 );
    callbacks.fire( "baz" );
    callbacks.remove( fn2 );
    callbacks.fire( "foobar" ); 
    /*輸出:
    foo
    fn2 says:foo
    bar
    fn2 says:bar
    baz
    fn2 says:baz
    foobar*/
})

3、方法清單:

  • callbacks.add():回調列表中添加一個回調或回調的集合。

  • callbacks.disable():禁用回調列表中的回調

  • callbacks.disabled():確定回調列表是否已被禁用。

  • callbacks.empty():從列表中刪除所有的回調.

  • callbacks.fire():用給定的參數調用所有的回調

  • callbacks.fired():訪問給定的上下文和參數列表中的所有回調。

  • callbacks.fireWith():訪問給定的上下文和參數列表中的所有回調。

  • callbacks.has():確定列表中是否提供一個回調

  • callbacks.lock():鎖定當前狀態的回調列表。

  • callbacks.locked():確定回調列表是否已被鎖定。

  • callbacks.remove():從回調列表中的刪除一個回調或回調集合。

二、延遲對象:deferred

在jQuery 1.5中新增了 Deferred 延遲對象,它是通過調用 jQuery.Deferred() 方法來創建的可鏈接的實用對象。它可注冊多個回調函數到回調列表,調用回調列表并且傳遞異步或同步功能的成功或失敗的狀態。 
延遲對象是可鏈接的,類似于一個 jQuery 對象可鏈接的方式,區別于它有自己的方法。在創建一個 Deferred 對象之后,您可以使用以下任何方法,直接鏈接到通過調用一個或多個的方法創建或保存的對象。

1、$.Deferred()定義和用法

$.Deferred() 是一個構造函數,用來返回一個鏈式實用對象方法來注冊多個回調,并且調用回調隊列,傳遞任何同步或異步功能成功或失敗的狀態。

  • $.Deferred() 構造函數創建一個新的 Deferred(延遲)對象, jQuery.Deferred 可傳遞一個可選的函數,該函數在構造方法返回之前被調用并傳遞一個新的 Deferred 對象作為函數的第一個參數。例如被調用的函數可以使用 deferred.then()來附加回調函數。

  • 一個 Deferred 對象開始于掛起狀態。任何使用 deferred.then(), deferred.always(), deferred.done(), 或者 deferred.fail() 添加到這個對象的回調函數都是排隊等待執行的。調用 deferred.resolve() 或 eferred.resolveWith() 轉換延遲到解決狀態后立即執行設置的 doneCallbacks 。調用 deferred.reject() 或 deferred.rejectWith() 轉換延遲到拒絕狀態后立即執行設置的 failCallbacks 。一旦對象已經進入了解決或拒絕狀態,它保持該狀態。回調仍然可以添加到已解決或已拒絕的 Deferred 對象——它們會立即執行。

設定兩個延時時間是隨機的定時器,分別用于解決(resolve)和拒絕(reject)延遲對象

$(function () { 
    function asyncEvent(){
        var dfd = new jQuery.Deferred();
        // 在一個隨機的時間間隔之后 Resolve (解決狀態)
        setTimeout(function(){
            dfd.resolve("歡呼");
        }, Math.floor(400+Math.random()*2000));

        // 在一個隨機的時間間隔之后 reject (拒絕狀態)
        setTimeout(function(){
            dfd.reject("對不起");
        }, Math.floor(400+Math.random()*2000));

        // 每半秒顯示一個"working..."消息
        setTimeout(function working(){
            if ( dfd.state() === "pending" ) {
                dfd.notify("working... ");
                setTimeout(working, 500);
            }
        }, 1);
        // 返回 Promise 對象,調用者不能改變延遲對象
        return dfd.promise();
    }
    // 為異步函數附加一個done, fail, 和 progress 處理程序
    $.when( asyncEvent() ).then(
        function(status){
            alert( status+', 事情進展順利' );
        },
        function(status){
            alert( status+', 這次你失敗了' );
        },
        function(status){
            $("body").append(status);
        }
    );
})

2、deferred.promise():

返回Deferred(延遲)的Promise對象。

  • 方法允許一個異步函數阻止那些干涉其內部請求的進度(progress)或狀態(status)的其它代碼。

  • 只包含 deferred 對象的一組方法,包括:done(),then(),fail(),isResolved(), isRejected(), always(), 這些方法只能觀察一個 deferred 的狀態,而無法更改 deferred 對象的內在狀態。

  • deferred.promise()也可以接受一個 target 參數,此時傳入的 target 將被賦予 Promise 的方法,并作為結果返回,而不是創建一個新對象。 
    deferred.promise( [target ] ) :使用目標參數

3、.promise():

返回一個 Promise 對象用來觀察當某種類型的所有行動綁定到集合,排隊與否還是已經完成。

  • .promise() 方法返回一個動態生成的 Promise,當綁定到集合中的所有特定動作(action)已經被加入或未被加入到隊列中時,生成的 Promise 將被受理(resolve)。

  • type 的默認值是"fx" ,這意味著被受理(resolve)的 Promise 對象是在所有被選中元素的動畫都完成時返回的。

  • 如果提供 target 參數,.promise() 在該參數上添加方法,然后返回這個對象,而不是創建一個新的。它適用于在一個已經存在的對象上添加 Promise 行為的情況。

語法:.promise( [type ] [, target ] )

type:String類型 需要待觀察隊列類型。

target:PlainObject類型 將要綁定 promise 方法的對象。

在一個沒有激活動畫的集合上調用 .promise()

$(function () { 
    var div = $( "
" );
    div.promise().done(function( arg1 ) {
        alert( this === div && arg1 === div );//彈出 "true"
    });
})

當所有的動畫結束時(包括那些在動畫回調函數和之后添加的回調函數中初始化的動畫),受理(Resolve)返回的 Promise。

$(function () { 
    $( "button" ).on( "click", function() {
        $( "p" ).append( "已開始..." );

        $( "div" ).each(function( i ) {
            $( this ).fadeIn().fadeOut( 100 * ( i + 1 ) );
        });

        $( "div" ).promise().done(function() {
            $( "p" ).append( " 完成! " );
        });
    });
})

4、jQuery.when():

提供一種方法來執行一個或多個對象的回調函數, Deferred(延遲)對象通常表示異步事件。

5、方法清單:

  • deferred.progress():當Deferred(延遲)對象生成進度通知時,調用添加處理程序。

  • deferred.done():當Deferred(延遲)對象解決時,調用添加處理程序。

  • deferred.fail():當Deferred(延遲)對象拒絕時,調用添加處理程序。

  • deferred.always():當Deferred(延遲)對象解決或拒絕時,調用添加處理程序。

  • deferred.catch():當Deferred對象被拒絕(reject)時,調用添加的處理程序。

  • deferred.notify():根據給定的 args參數 調用Deferred(延遲)對象上進行中的回調 (progressCallbacks)。

  • deferred.notifyWith():根據給定的上下文(context)和args遞延調用Deferred(延遲)對象上進行中的回調(progressCallbacks )。

  • deferred.resolve():解決Deferred(延遲)對象,并根據給定的args參數調用任何完成回調函數(doneCallbacks)。

  • deferred.resolveWith():解決Deferred(延遲)對象,并根據給定的 context和args參數調用任何完成回調函數(doneCallbacks)。

  • deferred.reject():拒絕Deferred(延遲)對象,并根據給定的args參數調用任何失敗回調函數(failCallbacks)。

  • deferred.rejectWith():拒絕Deferred(延遲)對象,并根據給定的 context和args參數調用任何失敗回調函數(failCallbacks)。

  • deferred.pipe():實用的方法來過濾 and/or 鏈Deferreds。

  • deferred.state():確定一個Deferred(延遲)對象的當前狀態。

  • deferred.then():當Deferred(延遲)對象解決,拒絕或仍在進行中時,調用添加處理程序。

到此,關于“Jquery回調對象與延遲對象怎么使用”的學習就結束了,希望能夠解決大家的疑惑。理論與實踐的搭配能更好的幫助大家學習,快去試試吧!若想繼續學習更多相關知識,請繼續關注億速云網站,小編會繼續努力為大家帶來更多實用的文章!

向AI問一下細節

免責聲明:本站發布的內容(圖片、視頻和文字)以原創、轉載和分享為主,文章觀點不代表本網站立場,如果涉及侵權請聯系站長郵箱:is@yisu.com進行舉報,并提供相關證據,一經查實,將立刻刪除涉嫌侵權內容。

AI

新沂市| 镇沅| 桂林市| 乐陵市| 宁明县| 水城县| 奎屯市| 陵水| 文昌市| 通榆县| 鹤峰县| 乌拉特后旗| 毕节市| 安图县| 永州市| 塘沽区| 蒲江县| 兴义市| 晋州市| 海宁市| 泸溪县| 深泽县| 霍林郭勒市| 五华县| 泗水县| 上杭县| 新密市| 夏津县| 仙居县| 嵊州市| 洪泽县| 郎溪县| 巴林左旗| 格尔木市| 永仁县| 桂东县| 台南县| 盈江县| 绥滨县| 鹤庆县| 肃宁县|