使用Jquery在列表中显示前20个项目>当用户单击更多时,它应该显示20个以上(40),依此类推。 ul未显示在加载状态-用户必须单击“更多加载”才能加载前20个项目
ul代码如下所示:-
<ul class="ulTbl" id="ReviewList" style="display: none">
@foreach (var review in Model)
{
<li class="hreview">
<div>
<p class="summary">@title</p>
<p class="description">@ReviewText</p>
<span class="moreLink" style="display: inline-
block;">"Read More"</span>
<span class="lessLink" style="display: none;">"Read Less"
</span>
</div>
</li>
}
</ul>
显示更多 显示较少
我尝试了各种方法来显示该广告,但无济于事
jQuery('ul.ulTbl').each(function()
{
if(jQuery(this).children('li').length <10)
{
jQuery(this).children('li:lt(5)').show();
jQuery(this).append('<button class="loadMore">LoadMore</button>');
}
});
jQuery('.loadMore').click(function ()
{
jQuery(this).parent('ul.ulTbl').children('li:gt(5)').show(); // use gt
instead of lt
});
$('#ReviewList li:lt('+2+')').show();
$('#ReviewList > li').slice(0, 2).show();
我希望ul首先显示20个项目,然后再显示40个项目,依此类推