首页
学习
活动
专区
圈层
工具
发布
社区首页 >问答首页 >JQuery:循环遍历多个列表,并为每个列表隐藏5个以上的子表

JQuery:循环遍历多个列表,并为每个列表隐藏5个以上的子表
EN

Stack Overflow用户
提问于 2016-02-26 21:08:41
回答 1查看 205关注 0票数 0

我有一个表,其中包含无序列表,每个列表中有几十个列表项。列表共享同一个类。我想循环遍历每个列表,如果它有超过5个列表项,我想显示前5项,隐藏其余部分,并显示到另一个页面的链接。

我在逻辑上有问题,因为我只能像上面所说的那样处理第一个无序列表,然后隐藏后面的所有其他列表。如果没有超过5行并继续到下一列,如何检查每个列表并中断?

下面是我尝试过的基本HTML和JS。

提前感谢您的帮助!

代码语言:javascript
复制
	$('ul.resultsList').each(function () { 
 	        if($(this).children().length > 4) {
			$('li:gt(4)').hide();
			$('.seeMore').show();
		}else {
                        $('.seeMore').hide();
                        return false;
                }
	});
代码语言:javascript
复制
    <table id="docResults">
	<thead>
		<tr>
			<th>Names</th>
		</tr>
	</thead>
	<tbody>
		<tr>
			<td>
				<ul class="resultsList">
					<li>Smith, J</li>
					<li>Smith, F</li>
					<li>Smith, K</li>
					<li>Smith, L</li>
					<li>Smith, M</li>
					<li>Smith, N</li>
					<li>Smith, O</li>
					<li>Smith, P</li>
					<li>Smith, Q</li>
					<li>Smith, R</li>
				</ul>
				<a href="#" class="seeMore">
			</td>
		</tr>
		<tr>
			<td>
				<ul class="resultsList">
					<li>Smith, J</li>
					<li>Smith, F</li>
					<li>Smith, K</li>
					<li>Smith, L</li>
					<li>Smith, M</li>
					<li>Smith, N</li>
					<li>Smith, O</li>
					<li>Smith, P</li>
					<li>Smith, Q</li>
					<li>Smith, R</li>
				</ul>
				<a href="#" class="seeMore">
			</td>
		</tr>
	</tbody>
</table>

EN

回答 1

Stack Overflow用户

回答已采纳

发布于 2016-02-26 21:12:19

尝试在此上下文中使用$(this)对象调用.hide()

代码语言:javascript
复制
$('ul.resultsList').each(function () { 
 var td = $(this).closest("td");
 if($(this).children().length > 4) {
   $('li:gt(4)', this).hide();
   $('.seeMore', td).show(); 
 }else {
   $('.seeMore', td).hide();
 }
});

演示

票数 1
EN
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接:

https://stackoverflow.com/questions/35661781

复制
相关文章

相似问题

领券
问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档