jquery - 如何隐藏多个项目但只调用一次处理程序？

Question

我隐藏了多个这样的项目：

$('#item1,#item2,#item3').hide('slow',function() {
    console.log('hidden');
});

问题是这会记录四次。由于我无法控制的原因，我无法在每个元素上使用公共类。有没有一种很好的 jquery-ish 方法可以让这个处理程序只在最后一项隐藏后才触发？（或第一个，因为它们应该几乎是同时的）

此外，元素将被隐藏和显示多次，因此用于限制处理程序调用的任何内容都必须在之后重置。

我显然可以在处理程序中放入某种布尔值，但我希望有一个更清洁的解决方案。

Answer 1

你可以使用$.when()和deferred.done()

$.when($('#item1,#item2,#item3').hide('slow')).done(function() {
   console.log('hidden');
});

简单的工作示例

Answer 2

关于什么...

$('#item1,#item2,#item3').hide('slow', function() {
    if ($(this).is(':last')){
        // code
    }
});

编辑：它不起作用，因为回调$(this)内部的上下文发生了变化。hide()首先尝试缓存选择器：

var $els = $('#item1,#item2,#item3');
$els.hide('slow', function(e) {
    if ($(this).is($els.last())){
        alert('test');
    }
});

Answer 3

您可以使用队列（尽管@ManseUK 的答案现在看起来是正确的方法）

$({})
    .queue(function(next){
        $('#item1, #item2, #item3').hide('slow', next);
    })
    .queue(function(){
        console.log('hidden');
    });

演示在http://jsfiddle.net/duzB8/

Answer 4

var counter = 0;
$('#item1,#item2,#item3').hide('slow',function() {
    counter++;
    if ( counter == 3 ){ console.log('hidden'); }
});