2

jQueryを使用してテーブルに新しい行を追加していて、必要に応じて行をフェードインさせていますが、2つの呼び出しを行うだけで、最初の使用afterでテーブルの最後に新しい行を追加し、次に使用hideしfadeInて取得します効果。これを圧縮したい

$(document).ready(function ($) {
    $("button").click(function () {
        $.get('@Url.Action("AddCalculatorRow", "Workshop", 
                           new { id = Model.Id } )', function (data) {
            $('.calculator').find("tbody tr:last").after(data);
            $('.calculator').find("tbody tr:last").hide().fadeIn(2000);
        });
    });
});

重複は、外観を実現するためのよりエレガントな方法があるに違いないことを教えてくれます. しかし、私がそれを作るなら

$('.calculator').find("tbody tr:last").after(data).hide().fadeIn(2000);

次に、追加された行が即座に表示され、最後の行が非表示になり、フェードインします...これはひどく見えます。

4

1 に答える 1

3

新しいコンテンツを追加した後、次の要素をターゲットにするだけです。

$('.calculator').find("tbody tr:last").after(data).next().hide().fadeIn(2000);

またはそれを交換します：

$(data).hide().appendTo('.calculator tbody').fadeIn(2000);

使用する前にデータを解析することも賢明ですが、それは完全にオプションです。

$($.parseHTML(data)).hide().appendTo('.calculator tbody').fadeIn(2000);
于 2013-04-02T19:16:31.667 に答える