如何使用 jqPagination [英] How to use jqPagination

问题描述

请帮帮我，我不知道如何使用jqPagination (http://beneverard.github.com/jqPagination/).我会每个页面都有其他内容.例如，第1页，内容是一个段落，第2页是其他段落.而且我不想点击显示/隐藏来显示内容.

谢谢！

解决方案

好吧，我只能假设你有类似这样的代码:

<p>我的第一段</p><p>我的第二段</p><p>我的第三段</p>
<div class="分页"><a href="#" class="first" data-action="first">&laquo;</a><a href="#" class="previous" data-action="previous">&lsaquo;</a><input type="text" readonly="readonly"/><a href="#" class="next" data-action="next">&rsaquo;</a><a href="#" class="last" data-action="last">&raquo;</a>

如果您想使用 jqPaginaton 按顺序显示/隐藏每个段落，请尝试以下代码:

$(document).ready(function() {//隐藏除第一段以外的所有段落$('.some-container p:not(:first)').hide();$('.pagination').jqPagination({max_page : $('.some-container p').length,分页:功能(页面){//已请求一个新的页面"//隐藏所有段落$('.some-container p').hide();//但显示我们想要的$($('.some-container p')[page - 1]).show();}});});

看看这个工作jsFiddle示例，它演示了使用插件能够显示和隐藏范围段.当然，这个例子也可以扩展到其他元素/场景.

请务必回复评论是否解决了您的问题.

Please help me, I don't know how to use jqPagination (http://beneverard.github.com/jqPagination/). I would each page which have other content. Ex, page 1, the content is a paragraph, page 2 is other paragraph. And I don't want click show/hide to show the content.

Thank you!

解决方案

Right, I can only assume you have code similar to this:

<div class="some-container">
    <p>My first paragraph</p>
    <p>My second paragraph</p>
    <p>My third paragraph</p>
</div>

<div class="pagination">
    <a href="#" class="first" data-action="first">&laquo;</a>
    <a href="#" class="previous" data-action="previous">&lsaquo;</a>               
    <input type="text" readonly="readonly" />
    <a href="#" class="next" data-action="next">&rsaquo;</a>
    <a href="#" class="last" data-action="last">&raquo;</a>
</div>

And you want to show / hide each of your paragraphs in order using jqPaginaton, try the following code:

$(document).ready(function() {

    // hide all but the first of our paragraphs
    $('.some-container p:not(:first)').hide();

    $('.pagination').jqPagination({
        max_page    : $('.some-container p').length,
        paged        : function(page) {

            // a new 'page' has been requested

            // hide all paragraphs
            $('.some-container p').hide();

            // but show the one we want
            $($('.some-container p')[page - 1]).show();

        }
    });

});​

Take a look at this working jsFiddle example, it demonstrates the use the plugin to be able to show and hide a range of paragraphs. Of course this example could be extended to work with other elements / scenarios too.

Be sure to comment back on whether this solved your problem.

这篇关于如何使用 jqPagination的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！