javascript - 一个js显示隐藏元素的问题
本文介绍了javascript - 一个js显示隐藏元素的问题的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!
问题描述
问 题
<div>
<ul class="list">
<li></li>
<li></li>
<li class="show"></li>
<li></li>
<li></li>
</ul>
<ul class="list">
<li class="show"></li>
<li></li>
<li></li>
<li></li>
<li></li>
</ul>
<ul class="list">
<li></li>
<li></li>
<li></li>
<li></li>
<li class="show"></li>
</ul>
</div>
<script>
var ul = document.querySelectorAll('ul.list');
ul.forEach(function (value, index, array) {
var li = value.querySelectorAll('li');
console.log(li.length);
for (var i = 0; i < li.length; i++) {
if (i > 2 ) {
li[i].style.display = 'none';
}
}
})
dcoument.getElementsByClassName("show").click(function () {
// show li
});
</script>
默认每个ul显示若干个li,点击show的时候全部显示
问题就是点击show的时候会影响到其它ul中的li的显示。
不能通过id去单个处理,因为内容比较多,都是从数据库里读出来的,会变。
是不是应该把 show 的 click 放到循环里面去监听?
补充: show 不一定是第一个元素……是变动的。是第一个或者最后一个都有可能……
谢谢大家抽时间来回答,目前觉得最好的方法还是找父元素再把全部子元素show()
$(".show").click(function () {
$(this).parent().children().show();
$(this).hide();
});
解决方案
$(".show").on("click",function(){
$(this).parent("list").find("li").show();
})
这篇关于javascript - 一个js显示隐藏元素的问题的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!
查看全文