我有隐藏的div，显示第一个，我想单击一个按钮以显示div，每次单击加载更多链接时，一旦所有div被加载，就禁用该链接。
这是一个jsfiddle来帮助说明我正在尝试做的事情：http : //jsfiddle.net/8Re3t/1/
<p><a href="#" id="load-more">Load More</a></p>
<div class="group active" id="group1">
Initially display
</div>
<div class="group" id="group2">
1 Hide until you click load more
</div>
<div class="group" id="group3">
2 Hide until you click load more
</div>
<div class="group" id="group4">
3 Hide until you click load more
</div>
$("#load-more").click(function() {
// show the next hidden div.group, then disable load more once all divs have been displayed
});
那这样的事情呢：
var $group = $('.group');
$("#load-more").click(function() {
// Prevent event if disabled
if ($(this).hasClass('disable')) return;
var $hidden = $group.filter(':hidden:first').addClass('active');
if (!$hidden.next('.group').length) {
$(this).addClass('disable');
}
});
我将类添加disable到链接以直观地使其看起来像已禁用：
#load-more.disable {
color: #AAA;
text-decoration: none;
cursor: default;
}
您还可以根据需要取消绑定点击事件： $(this).addClass('disable').off('click');
本文收集自互联网，转载请注明来源。
如有侵权，请联系[email protected] 删除。
我来说两句