的slideToggle和:可见(slideToggle and :visible)

2019-07-03 23:16发布

当使用sliderToggle法, :visible表情似乎永远不会返回不是真正的任何其他。

如果我手动使用show / hide会同:visible表达它会工作得很好。

失败的例子:

jQuery(".fileNode .nodeExpander").click(function() {
    var notes = jQuery(this).parent().siblings(".fileNotes");
    notes.slideToggle ("fast");

    var isVisible = notes.is(":visible"); // Always returns true...

    // Do stuff based on visibility...
});

工作的例子:

jQuery(".fileNode .nodeExpander").click(function() {
    var notes = jQuery(this).parent().siblings(".fileNotes");
    var isVisible = notes.is(":visible");

    if (isVisible)
        notes.hide("fast");
    else
        notes.show("fast");

    // Do stuff based on visibility...
});

一些HTML代码:

<ul>
    <li class="fileNode">
        <img src="<%= Url.Content ("~/Images/Collapse.png") %>" alt="<%= UIResources.CollpaseAltText %>" class="nodeExpander" />
    </li>
    <li class="fileLink">
        <%= Html.ActionLink (file.Name, "Details", new { id = file.FileId }) %>
    </li>
    <li class="fileNotes">
        <%= file.Description %>
    </li>
</ul>

我假设slideToggle没有做一个show / hide -是有什么事我可以检查?

我试着在Firefox 3.5,IE 7,8和Chrome 4 ...所有相同的结果。

谢谢,K

Answer 1:

您的第一个(非工作)的代码片段将测试:visible ,而为的slideToggle中期过渡(更准确地说,它测试它只是过渡开始后),无论你打开或关闭,中间过渡状态会是:visible -所以你总是得到true

尝试检查.is(":visible")调用之前slideToggle



Answer 2:

尝试添加的处理程序。

notes.slideToggle ("fast", function() { 
  var isVisible = notes.is(":visible");
});


文章来源: slideToggle and :visible