0

表の行をフェードアウトする方法を説明するデモがたくさんあります。IE のために、表のセルをフェードアウトし、アニメーションの完了後に行を削除する必要があります。たとえば、この質問:フェードアウトとテーブル行の削除

私はこのテクニックをうまく機能させています。行がフェードアウトして削除された後、ajax 呼び出しでテーブルを更新したいと考えています。このajaxロードをfadeOut completeコールバックに入れると、テーブルの列ごとに1回起動します(行ではなくテーブルセルをフェードアウトしているため)。これにより、大量の ajax リクエストが積み重なっていきます。（正常に機能します。バストは無駄で悪い習慣です。）

そのため、テーブルの行をフェードアウトして削除し、イベントを発生させたり、関数を 1 回だけ呼び出してグリッドを更新したいと考えています。jQueryでこれを行うためのベストプラクティスは何ですか? すべてのテーブル セルをアニメーション化する必要がありますが、アニメーション完了のコールバックは 1 つしかありません。

.remove() にはコールバックがないので、.hide() のような他の効果を使用し、.remove() を ajax とともにそのコールバック内に配置する必要がありますか? ブラウザ間の互換性はどのようになりますか? 古いバージョンの IE のテーブル行への影響に関する既知の問題はありますか?

注:違いはありませんが、たまたま jQuery UI の上に構築された wijmo グリッド ウィジェットを使用しています。しかし、それはマークアップの通常の html テーブルです。フェードアウト/削除は正常に機能します。

4

1 に答える 1

0

あなたが直面している問題は、コレクション全体ではなく、fadeOut一致した要素 (すべて) ごとにコールバックが実行されることです。tdあなたがする必要があるのは、最後の要素がフェードアウトした後に remove と ajax を配置することです。以下に、このニーズに合わせて更新された、参照した質問のコードを示します (アラートと削除は 1 回だけ実行されます)。

// don't use live, switch to delegate
$('#tbl').delegate('td', 'click', function() {  
    var tr = $(this).parents('tr:first'),
        tds = tr.find('td'),
        l = tds.length;

    tds.fadeOut('fast', function(){ 
        if (! --l) {
            tr.remove();                    
            alert('ajax');
        }
    });    

    return false;
});

そして、これが実際の小さな例です: http://jsfiddle.net/a76A6/2/

于 2011-11-25T20:48:14.757 に答える