Question

我正在使用simple pagination来运行我的网站，但我遇到了一个问题。我有导航的css选项卡，在每个导航中我都有一个与前一个不同的分页。

jquery分页代码

$(function(){
var perPage = 8;
var opened = 1;
var onClass = 'on';
var paginationSelector = '.pages';
$('.gallery').simplePagination(perPage, opened, onClass, paginationSelector);
});

.gallery用于调用我假设的图库样式，但使用此代码的唯一方法（如我所知）就是第二次调用它。

$(function(){
var perPage = 8;
var opened = 1;
var onClass = 'on';
var paginationSelector = '.pages2';
$('.gallery2').simplePagination(perPage, opened, onClass, paginationSelector);
});

我的第一个问题，有没有办法简化代码，我不知道必须重复每个jquery调用？

第二个问题，无论如何，当我尝试调用相同的css代码时

.gallery, .gallery2 {
    float: left;
    overflow: hidden;
    padding: 3px 4px 5px 6px;
    margin: 3px 4px 5px 6px;
    height: 552px;
    width:850px;
}

 .gallery, .gallery2 li {
    float: left;
    display: inline;
    font-weight: bold;
    width: 190px;
    padding: 3px 4px 5px 6px;
    background: #E6E6FA;
    border: 1px solid #999999; 
    text-align: center;
    margin: 3px 4px 5px 6px;
    font: 12px Arial, Helvetica, Sans-serif;
    color: #4c4c4c;
    height: 255px;
    -webkit-border-radius: 8px;
    -moz-border-radius: 8px;
    border-radius: 8px; 
    }

这段代码不起作用，我必须自己分开每个图库的代码，然后才能工作。我的意思是我可以管理，但1编辑意味着我必须编辑5次以上。知道为什么这不起作用吗？

由于这个电话，我认为它不起作用。它正在寻找.gallery？正确？有没有办法改变代码以使多个类选择成为可能？

$('.gallery').simplePagination(perPage, opened, onClass, paginationSelector);
});

Answer 1

这会将分页事件绑定到具有类（gallery2和gallery）的元素

$(function(){
    var perPage = 8;
    var opened = 1;
    var onClass = 'on';
    $('.gallery').simplePagination(perPage, opened, onClass, '.pages');
    $('.gallery2').simplePagination(perPage, opened, onClass, '.pages2');
});

你至少可以这样做，不知道你有多少页面或你的代码是什么样的。可以通过在“gallery”和“pages”之后添加1（或者如果i == 1，或者没有，等等）循环来解决。

最后的css更改为 .gallery li, .gallery2 li

简单分页使用多个css选择器的多个页面

1 个答案: