JS（JQ）分页 个人查看，没注释

前端表格

<table cellpadding="3" cellspacing="1" class="excel-table">
　　<tr>
   　　<th>会员电话</th>
   　　<th>会员名称</th>
      <th>会员绘本数量</th>
 　　  <th>操作</th>
    　</tr>
   　{foreach from=$userList item=vo}
    　　<tr class="trs">
        　　<td>{$vo.mobile_phone}</td>
        　　<td>{$vo.user_name2}</td>
        　　<td>
             　　<input class="user-huiben" name="user_huiben[{$vo.user_id}]" value="{$vo.user_huiben}" maxValue="{$vo.user_huiben}">    
        　　</td>
        　　<td>
           　　  <img class="remove-tr" src="images/icon_trash.gif" width="21" height="21" border="0" style="cursor: pointer;" title="此会员不代捐">
         　　</td>
　　　　</tr>
　　{/foreach}
</table>

JS

document.onkeydown = function () {
    if (window.event && window.event.keyCode == 13) {
        window.event.returnValue = false;
    }
}
$(function(){
    console.log($('.trs').length);
    trs = '';
    pagePre = '';
    pageNext = '';
    pageSel = '';
    pageQ = '';
    removeTr = $('.remove-tr');
    curPage = 1;
    pageSize = 10;
    maxPage = 1;
    pageBox = $('#turn-page');
    $('.user-huiben').change(function(){
        var x = $(this).val();
        var y =    parseInt($(this).attr('maxvalue'));
        x = x<1?0:x;
        x = x>y?y:x;
        $(this).val(x);
    });
    removeTr.click(function(){
        if(confirm('此会员这次不代捐吗？')){
            $(this).parents('.trs').remove();
            initPage();
        }
    });
    function changePage(page){
        page = parseInt(page);
        page = (page<1)?1:page;
        curPage = (page>maxPage)?maxPage:page;
        showStart = (curPage-1)*pageSize;
        trs.hide();
        $('.trs:eq('+showStart+')').show();
        $('.trs:gt('+showStart+'):lt('+(pageSize-1)+')').show();
        
        var str = '总共'+$('.trs').length+'条记录,每页总共<input class="page-q" value="'+pageSize+'" size="4">条记录 当前为第'+curPage+'/'+maxPage+'页，';
        str += '<span class="page-pre">上一页</span>';
        str += '<span class="page-next">下一页</span>';
        var strSelect = '<select class="page-sel">';
        for(var i = 1;i<=maxPage;i++){
            if(i == curPage){
                strSelect += '<option value="'+i+'"  selected="selected">'+i+'</option>';
            }else{
                strSelect += '<option value="'+i+'">'+i+'</option>';
            }
        }
        str += strSelect;
        pageBox.html(str);
        if(pagePre != ''){
            pagePre.unbind();
        }
        if(pageNext != ''){
            pageNext.unbind();
        }
        if(pageSel != ''){
            pageSel.unbind();
        }
        if(pageQ != ''){
            pageQ.unbind();
        }
        pagePre = $('.page-pre');
        pageNext = $('.page-next');
        pageSel = $('.page-sel');
        pageQ = $('.page-q');
        pagePre.bind('click',function(){
            changePage(curPage-1);
        });
        pageNext.bind('click',function(){
            changePage(curPage+1);
        });
        pageSel.bind('change',function(){
            changePage($(this).val());
        });
        pageQ.bind('change',function(){
            var x= parseInt($(this).val());
            if(x<1){
                return false;
            }else{
                pageSize = x;
                curPage = 1;
                curPage = 1;
                initPage();
            }
        });
    }
    function initPage(){
        trs = $('.trs');
        maxPage = Math.ceil(trs.length/pageSize);
        changePage(curPage);
    }
    initPage();
});