【问题标题】:How to add current active states in pagination bootstrap如何在分页引导程序中添加当前活动状态
【发布时间】:2017-12-01 08:52:17
【问题描述】:
如何在分页引导中添加当前活动状态?
我的代码
...
<?php for ($page=1; $page <= $total_pages ; $page++):?>
<li class="page-item">
<a href='<?php echo "?page=$page"; ?>' class="links"><?php echo $page; ?></a>
</li>
<?php endfor; ?>
...
【问题讨论】:
标签:
php
twitter-bootstrap
pagination
【解决方案1】:
将active 类添加到li。
例子
<ul class="pagination">
<li><a href="#">1</a></li>
<li class="active"><a href="#">2</a></li>
<li><a href="#">3</a></li>
<li><a href="#">4</a></li>
<li><a href="#">5</a></li>
</ul>
【解决方案2】:
<script>
var url = window.location;
// Will only work if string in href matches with location
$('ul.pagination a[href="'+ url +'"]').parent().addClass('active');
// Will also work for relative and absolute hrefs
$('ul.pagination a').filter(function() {
return this.href == url;
}).parent().addClass('active');
</script>