javascript - 1つを除くすべてのリストアイテムを削除する方法（jQuery）

Question

だから私はワンクリックですべてのリストアイテムを削除する方法を探しています、それほど難しいことではありませんが、それにいくつかの素晴らしい効果を与えるために、最初のスライドアップをさせてこれを削除したいと思いましたすべてのリストアイテムが削除されるまで、アイテムなど。

Answer 1

以下は、リスト内のすべてのアイテムを一度に順番に削除します。

$('button').click(function() {
    var $first = $('#list li:first')
    removeItem($first);
})


function removeItem($el) {
    $el.slideUp(function() {

        var $next = $el.next()
        if ($next.length) {
            removeItem($next)
        }
        $(this).remove()
    })
}

デモ: http://jsfiddle.net/UzPy5/2/

個別に削除するには

Answer 2

すべてのリスト項目に同じクラスを与えてから、配列を返す $(".yourclass") を呼び出します。次に、スライドアップ関数とタイミングを設定できる setInterval (http://www.w3schools.com/js/js_timing.asp) などを使用してその配列を調べます。あなたが望むスライド（http://api.jquery.com/animate/）または他のプラグインのためかもしれません。

Answer 3

fadeOutリスト内の各要素を再帰的に。これは jQuery なしでも可能ですが、独自のアニメーションを作成する (または CSS アニメーションを使用する) 必要があります。

function fadeList(list, index) {
  if (index < list.length) {
    list[index].fadeOut(800, function() {
      fadeList(list, i+1);
    });
  }
}

$('#remove-btn').on('click', function(e) {
  fadeList($('#my-list li'),0);
 });