slideToggle和:可见

时间:2009-08-28 08:11:13

标签: jquery jquery-1.3.2

使用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 ......所有结果都相同。

谢谢, ķ

2 个答案:

答案 0 :(得分:29)

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

在致电.is(":visible")

之前,请尝试检查slideToggle

答案 1 :(得分:4)

尝试添加处理程序。

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