您的位置:首页 > Web前端 > JavaScript

js控制表格静态分页显示

2015-07-31 15:20 579 查看
    <div class="page"></div>

<script src="static/script/jquery.js"></script>

<script src="static/script/jquery.table.js"></script>

<script language="javascript" type="text/javascript">

$(function(){

    var $table=$("table");

    var currentPage=0;

    var pageSize=19;

    $table.bind( 'paging', function(){

        $table.find('tbody tr').hide().slice(currentPage*pageSize, (currentPage+1)*pageSize).show();

    });

    var sumRows=$table.find('tbody tr').length;

    var sumPages=Math.ceil(sumRows/pageSize);

    var $pager=$('<div></div>');

    for( var pageIndex=0;pageIndex<sumPages;pageIndex++) {

        $('<a  href="#"><span>'+(pageIndex+1)+'</span></a>').bind("click",{"newPage":pageIndex},function(event){

            currentPage=event.data["newPage"];

            $table.trigger("paging");

        }).appendTo($pager);

        $pager.append(" ");

    }

    $pager.insertAfter($table);

  
4000
  $table.trigger("paging");

});
</script>

表格必须有tbody
内容来自用户分享和网络整理,不保证内容的准确性,如有侵权内容,可联系管理员处理 点击这里给我发消息
标签:  html javascript