我尝试根据此视频使用 JavaScript 制作 Accordion 效果,更改了一些内容,例如使用输入按钮而不是选择器的链接。但是由于某种原因它不起作用。每次我尝试使用 Firefox 错误控制台时,它都会输出未知的伪类或伪元素“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 完成的遍历不匹配。每个<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>
关于JavaScript Accordion 效果不起作用,与伪类有关?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/2631773/