当我单击“标题文本”时,<ol>
元素不会隐藏,而且应该。我已经检查了 .click() .children() .toggle() 和 .hide() 上的 jquery 文档(并进行了搜索),但我找不到任何我做错的事情。我在http://codepen.io工作环境。
我的 HTML
<p class="hidable">title text
<ol>
<li>item</li>
<li>item</li>
</ol>
</p>
我的 JavaScript
$(document).ready(function() {
$('.hidable').click(function() {
$(this).children().toggle();
});
});
最佳答案
段落只能包含内联元素。
你的<ol>
在哪里是一个 block 元素,当您的浏览器呈现您的代码时,它会在有序列表的两侧放置一个段落,有序列表不是该段落的子元素:
将列表放在段落后面怎么样:
$(document).ready(function () {
$('.hidable').click(function () {
$(this).next('ol').toggle();
});
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script>
<p class="hidable">title text</p>
<ol>
<li>item</li>
<li>item</li>
</ol>
关于javascript - 将点击监听器附加到类以切换所有子级的可见性,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/26493330/