springmvc结合ajax的分页功能

var itemCount;//符合查找条件的商品总页数,分页参考
var pageIndex = 0;//当前页,默认为0
var pageSize = 8;//每页显示个数为8

//按条件查找用户
function searchItem(pageIndex,pageSize){

//清空要append的目的位置
$('#searchItem').empty();

$('.ajax_page').empty();


var url = "${ctx}/crms/orderCenter/findItemList";
$.post(url,{"pageIndex":0,"pageSize":8},function(data){
  var items = data.itemList;
  var appendItem = '';
  itemCount = Math.ceil(data.itemCount/8);
  //查询结果所有的商品
  $.each(items,function(i,result){
    appendItem = "<tr class='w790 h55'><td class='w75 text-center bgc_fafafa'>"
    + "<input type='text' class='num_iid' value='"+result.numIid+"'>"
    + "<div οnclick='addNumIid("+result.numIid+")' class='w20 h20 bgc_e0e6ef margin0_auto b_radius5 GXK'></div>"
    + "</td><td class='w620 bgc_fafafa'><img class='w54 h45 m_t5 m_l10 m_r20 f_l' src='"+result.url+"'><p class='w400 h55 lh55 f_l'>"+result.title+"</p></td>"
    + "<td class='w78 text-center bgc_fafafa'>"+result.price+"</td></tr>";
    $('#searchItem').append(appendItem);
  });
  //分页
  var page = '<div id="userPage" align="center" ><font size="2">共'+itemCount+'页</font><font size="2">第'
      +(pageIndex+1)+'页</font> <a href="javascript:void" οnclick="goToFirstPage()" id="aFirstPage" >首页</a>'
      +'<a href="javascript:void" οnclick="goToPrePage()" id="aPrePage">上一页</a>'
      +'<a href="javascript:void" οnclick="goToNextPage()" id="aNextPage">下一页</a>'
      +'<a href="javascript:void" οnclick="goToEndPage()" id="aEndPage">尾页</a>';
      page+='</div>';
    $('.ajax_page').append(page);
},'json');
};


//首页
function goToFirstPage(){
  pageIndex = 0;
  searchItem(pageIndex,pageSize);
}


//前一页
function goToPrePage(){
  pageIndex -= 1;
  pageIndex = pageIndex >= 0 ? pageIndex : 0;
  searchItem(pageIndex,pageSize);
}


//后一页
function goToNextPage(){
  if(pageIndex + 1 < itemCount){
    pageIndex += 1;
  }
  searchItem(pageIndex,pageSize);
}
//尾页
function goToEndPage(){
  pageIndex = itemCount -1;
  searchItem(pageIndex,pageSize);
}

转载于:https://www.cnblogs.com/ztk1994/p/6524083.html

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值