[閒聊] JQuery的callback與queue

看板Ajax作者JYHuang (夏天到了，冷不起來了說)時間15年前 (2010/08/25 11:41)推噓1(1推 0噓 1→)

留言2則, 1人參與討論串1/4 (看更多)

這幾天在寫一個grid的功能，遇到了一點小問題。就拿出來討論一下。 ╔═╦═╦═╗ th ║1 ║2 ║3 ║ ╟─╫─╫─╢ td ├─┼─┼─┤ td ├─┼─┼─┤ td └─┴─┴─┘ 簡單的說，我要做的動作大至上是click th[n]時， th跟每列的第n個td都做fadeOut的動作然後再用test()計算table的寬度首先 $("thead th").click(function(){ var index =$(this).index(); $("td:eq("+index+")","tr").fadeOut('slow'); test(); }); 當然..事情沒憨人想的這麼簡單 javascript的指令是不會停下來等動作執行完再執行下一行的所以fadeOut這種有時間軸的動作會跟test()一起被執行這樣一來計算出來的寬度就有誤了。所以接著試試看callback $("thead th").click(function(){ var index =$(this).index(); $("td:eq("+index+")","tr").fadeOut('slow',test); }); 不過問題又來了.. 要執行的對像是一個集合.. 所以callback會被每一個子元件重複的執行... 此時想到了JQuery還有一個queue的功能.. 不過看了半天官方API文件還是一頭霧水..只好慢慢踹.. jQuery.queue( $("td:eq("+index+")","tr")[0], "fx", function () { test(); jQuery.dequeue( this ); }); 問題在紅色的框那裡.. 那個框似乎是指集合的index 當集合第index個元件執行完之後才會跑test()，而這裡是以元件的集合做動作所以如果照著官方給[0]的話會在第一行的td fadeOut後就執行test了所以要先計算出集合的長度.. var _len = $("td:eq("+index+")","tr").size() jQuery.queue( $("td:eq("+index+")","tr")[_len -1], "fx",.... 或是直接指向集合的最後一個元件 jQuery.queue( $("td:eq("+index+")","tr").filter(":last")[0], "fx",..... 這邊用filter而不是selector中用:last，是因為這是指所以集合中的最後一個直接在Selector中用:last的話，會是指每個tr第index個td的最後一個 JQuery的selector好複雜 =.=... 另外... 那個dequeue的功用到底是？ -- ※ 發信站: 批踢踢實業坊(ptt.cc) ◆ From: 114.39.160.84 ※ 編輯: JYHuang 來自: 114.39.160.84 (08/25 11:45)