我要删除
<button id="load-more-comments"></button>
如果评论不超过20条
更多加载按钮不再出现
如果有更多21条评论,请使用显示更多加载按钮
我的代码
var $parent = $("ol"),
$items = $parent.find("li"),
$loadMoreBtn = $("#load-more-comments"),
maxItems = 20,
hiddenClass = "visually-hidden";
// add visually hidden class to items beyond maxItems
$.each($items, function (idx, item) {
if (idx > maxItems - 1) {
$(this).addClass(hiddenClass);
// if last comment, hide button see more
});
// onclick of show more button show more = maxItems
// if there are none left to show kill show more button
$loadMoreBtn.on("click", function (e) {
$("." + hiddenClass).each(function (idx, item) {
if (idx < maxItems - 1) {
$(this).removeClass(hiddenClass);
}
// kill button if no more to show
if ($("." + hiddenClass).size() === 0) {
$loadMoreBtn.hide();
}
});
});
这是我的CSS
.visually-hidden {
position: absolute;
overflow: hidden;
clip: rect(0 0 0 0);
height: 1px;
width: 1px;
margin: -1px;
padding: 0;
border: 0;
}
答案 0 :(得分:1)
非常简单,只需将这段代码放在
之后hiddenClass =“视觉上隐藏”;
代码:
const destroy$ = new Subject<boolean>();
downloadSubscription.takeUntil(destroy$).subscribe(
// main body
},
(downloadEvent: FailureDownloadEvent) => {
// error
destroy$.next(true);
destroy$.unsubscribe();
},
() => {
// cleanup
destroy$.next(true);
destroy$.unsubscribe();
}
);
}