jquery - 滑动切换和：可见

Question

使用该sliderToggle方法时，:visible表达式似乎永远不会返回 true 以外的任何内容。

如果我手动将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 中尝试过……结果都一样。

谢谢，克

Answer 1

您的第一个（非工作）代码片段将:visible在 slideToggle 处于中间转换时进行测试（更准确地说，它在转换开始后对其进行测试。）无论您是打开还是关闭，中间转换状态都将是:visible-所以你总是得到true。

.is(":visible")打电话前先检查一下slideToggle

Answer 2

尝试添加处理程序。

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