JavaScript手风琴效果不起作用，与伪类有关吗？

【问题标题】：JavaScript accordion effect won't work, something to do with pseudoclass?JavaScript手风琴效果不起作用，与伪类有关吗？
【发布时间】：2013-09-26 05:18:29
【问题描述】：

我尝试根据此视频使用 JavaScript 制作手风琴效果，更改了一些内容，例如使用输入按钮而不是选择器的链接。但是由于某种原因它不起作用。每次我尝试使用它时，Firefox 错误控制台都会输出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>

【问题讨论】：

标签： javascript jquery dhtml pseudo-class

【解决方案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>

【讨论】：

感谢您的帮助！有没有办法我可以在没有 div 的情况下做到这一点，并且只更改 JavaScript？我不太明白为什么它不起作用。
@Dennis：您可以删除对parent() 的调用。然后next() 将从<input> 转到它后面的元素。