Question

我已经做了我想要的实例：

尝试点击一行：

Aujourd'hui（lundi 5 mars）
Demain（mardi 6 mars）
Aprèsdemain（mercredi 7 mars）
Vendredi 8火星
Un autre jour

然后尝试点击另一行：它效果很好：它隐藏了前一个并显示了新的一个。

现在尝试重新点击第一行：没有任何反应！为什么呢？

因为该代码正常=该元素被视为可见：

if ($(id).is(':visible')) {
    return;
}

这意味着在一个slideUp（）之后，该元素被视为可见。

知道怎么回事？

[编辑]

我已经更改了我的代码，所以它现在可以在这里工作：http://jsfiddle.net/uRhuK/2/但是我不知道它是否是干净的jQuery代码。

Answer 1

“visibility”是与“slideup”分开的属性，它操纵元素的高度。有些东西可以是0px，但仍然是“可见的”

查看您的代码，您实际上并未重置可见性：

$('.heuresresume').hide();
$('.heuresdetail').hide();
$('ul.jour > li').unbind('click').click(function(event) {
    event.preventDefault();
    var id = '#heuresresume' + parseInt(this.id.substr(4));
    console.log('-------------------');
    console.log(id);
    console.log($(id));
    console.log('visible :' + $(id).is(':visible')); 
    console.log('hidden :' + $(id).is(':hidden'));
    if ($(id).is(':visible')) {
        console.log('visible');
        return;
    }
    $('.heuresresume :not(' + id + ')').slideUp('slow');
    $(id).slideDown('slow');
});

您永远不会将任何内容设置为不可见。 SlideUP不会根据我的经验修改此属性，仅修改元素尺寸。

编辑：为了简化事情，为什么不为元素指定一个类来指定它是扩展还是收缩？这将是最好的，最少侵入性的方法 - 将它捎带到“幻灯片/向下”指令imho

Answer 2

检查display:none而不是visible

Answer 3

使用jQuery或jQueryUI显示/隐藏几乎总是会修改display属性（display：none，display：block等）。 Visible完全是一个不同的属性，用于隐藏元素但保持其占用区域。

因此，要检查某些内容是否隐藏，或者您是否要自己隐藏某些内容，您几乎应该始终检查display css属性并且不可见。

Answer 4

修改答案.....问题是由于隐藏了UL LI的

 $('.heuresdetail').hide();/* hide sub li*/

即使显示父UL，这些仍然隐藏：阻止

jQuery：隐藏的元素被认为是“可见的”，为什么？

4 个答案: