JavaScript手风琴效果不会起作用，和伪类有什么关系？

Question

我试着根据这段视频用JavaScript制作一个手风琴效果，改变了一些东西，比如使用输入按钮而不是选择器的链接。然而，由于某些原因，它无法工作。每次我尝试使用火狐错误控制台时，它都会输出unknown pseudo-class or pseudo-element "visible"。有什么问题吗？

$("div.example").hide();
$("input.exampleButton").click(function(){
    $("div.example:visible").slideUp("slow");
    $(this).parent().next().slideDown("slow");
    //return false; if you don't want the link to follow
});

这是HTML

input type="button" value="See An Example" class="exampleButton" />
<div class="example">
    ...content
</div>
input type="button" value="See An Example" class="exampleButton" />
<div class="example">
    ...content
</div>

Answer 1

您可以在控制台中忽略该警告。代码不工作的原因是标记结构与Javascript完成的遍历不匹配。每个<input>可能都应该在一个<div>中，这样对parent().next()的调用才能正确地从输入转到后面的<div class="example">。您还遗漏了输入上的开头<，但我认为这是复制/粘贴错误。

工作标记：

<div>
    <input type="button" value="See An Example" class="exampleButton" />
</div>
<div class="example">
    ...content
</div>
<div>
    <input type="button" value="See An Example" class="exampleButton" />
</div>
<div class="example">
    ...content
</div>