我是jQuery的新手，但遇到了一些麻烦。
这是我的HTML：
<div id="mainpage-tabs-area">
<ul class="nav cf">
<li class="tb-one"><a href="#description" class="current">BTN1</a></li>
<li class="tb-two"><a href="#tabtwo">BTN2</a></li>
<li class="tb-three"><a href="#tabthree">BTN3</a></li>
<li class="tb-four"><a href="#tabfour">BTN4</a></li>
</ul>
<div class="list-wrap">
<ul id="description">
<li>Hello, I am a description</li>
</ul>
<ul id="tabtwo" class="hide">
<li></li>
</ul>
<ul id="tabthree" class="hide">
<li></li>
</ul>
<ul id="tabfour" class="hide">
<li></li>
</ul>
</div> <!-- END List Wrap -->
</div> <!-- END Organic Tabs -->
这是我当前的jQuery：
$(document).ready(function () {
var tabContent = $('ul.list-wrap').find('li').text();
if ($.trim(tabContent) === "") {
$('ul.nav li').hide();
}
});
我想要做的就是仅使用jQuery检查.list-wrap中的每个li，如果该li为空，则删除.nav中的相应li，因为这是用于制表符系统，如果不输入任何内容，它们不想显示它。
对新手有什么建议吗？
缺口
我将遍历列表项，检查每个节点的文本的长度，并使用以下命令隐藏相应的选项卡：
$('.list-wrap li').each(function(i){
if(!$(this).text().length) $('#mainpage-tabs-area li').eq(i).hide();
})<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<div id="mainpage-tabs-area">
<ul class="nav cf">
<li class="tb-one"><a href="#description" class="current">BTN1</a>
</li>
<li class="tb-two"><a href="#tabtwo">BTN2</a>
</li>
<li class="tb-three"><a href="#tabthree">BTN3</a>
</li>
<li class="tb-four"><a href="#tabfour">BTN4</a>
</li>
</ul>
<div class="list-wrap">
<ul id="description">
<li>Hello, I am a description</li>
</ul>
<ul id="tabtwo" class="hide">
<li></li>
</ul>
<ul id="tabthree" class="hide">
<li></li>
</ul>
<ul id="tabfour" class="hide">
<li></li>
</ul>
</div>
<!-- END List Wrap -->
</div>
<!-- END Organic Tabs -->函数中的iineach()是循环所在元素的索引，它使您可以定位相应的tab元素并将其隐藏。
本文收集自互联网，转载请注明来源。
如有侵权，请联系 [email protected] 删除。
我来说两句