首页 > 解决方案 > 如何默认选择特定页面?

问题描述

我有一个分页,如此处所示https://jsfiddle.net/solodev/yw7y4wez/

我想默认选择或突出显示某些页面(假设第 8 页)

我尝试了以下代码,但它不起作用

page = '@Model.CurrentPageIndex';
$('.page-active').removeClass('page-active');
$('#page' + page).addClass('page-active');

其中“@Model.CurrentPageIndex”包含页码。(例如 8 个)

标签: javascriptjquerycss

解决方案


分页允许您设置起始页。您在 jsfiddle 示例中有它。

$('#pagination-demo').twbsPagination({
totalPages: 5,
// the current page that show on start
startPage: 2, //THIS IS THE LINE THAT CHANGES START PAGE

// maximum visible pages
visiblePages: 5,

initiateStartPageClick: true,

// template for pagination links
href: false,

// variable name in href template for page number
hrefVariable: '{{number}}',

// Text labels
first: 'First',
prev: 'Previous',
next: 'Next',
last: 'Last',

// carousel-style pagination
loop: false,

// callback function
onPageClick: function (event, page) {
    $('.page-active').removeClass('page-active');
  $('#page'+page).addClass('page-active');
},

// pagination Classes
paginationClass: 'pagination',
nextClass: 'next',
prevClass: 'prev',
lastClass: 'last',
firstClass: 'first',
pageClass: 'page',
activeClass: 'active',
disabledClass: 'disabled',

});

当你使用这个插件时,最好使用它的功能而不是在上面添加你自己的功能。这样,它可以确保“上一个”和“最后一个”等其他功能仍然有效。


推荐阅读