這篇文章主要介紹了layui如何實(shí)現(xiàn)分頁，具有一定借鑒價(jià)值，需要的朋友可以參考下。希望大家閱讀完這篇文章后大有收獲。下面讓小編帶著大家一起了解一下。

專業(yè)成都網(wǎng)站建設(shè)公司，做排名好的好網(wǎng)站，排在同行前面，為您帶來客戶和效益!創(chuàng)新互聯(lián)建站為您提供成都網(wǎng)站建設(shè)，五站合一網(wǎng)站設(shè)計(jì)制作，服務(wù)好的網(wǎng)站設(shè)計(jì)公司，成都網(wǎng)站制作、成都網(wǎng)站設(shè)計(jì)負(fù)責(zé)任的成都網(wǎng)站制作公司!

這是是基于自己搭建的SSM案例框架來實(shí)現(xiàn)

效果圖如下

分頁jsp和js內(nèi)容模塊，暫時(shí)寫在了一塊，當(dāng)然也可以提出來寫個(gè)js文件

<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<%
String path = request.getContextPath();
String basePath = request.getScheme()+"://"+request.getServerName()+":"+request.getServerPort()+path+"/";
%>



  
  
 
    
    
    
  


 

 

     
 
 搜索
 
 
 
 

后臺(tái)實(shí)現(xiàn)

主要的地方就是page<當(dāng)前頁，比如1頁>、limit<當(dāng)前顯示數(shù)據(jù)，比如10條數(shù)據(jù)>、count<當(dāng)前表總數(shù)據(jù)條數(shù)>，其他的事情有l(wèi)ayui分頁插件來做(jsp頁面有該代碼)，只要page、limit、count這三個(gè)值，分頁就能實(shí)現(xiàn)

//分頁插件
    ,page: { //支持傳入 laypage 組件的所有參數(shù)（某些參數(shù)除外，如：jump/elem） - 詳見文檔
    	layout: ['limit', 'count', 'prev', 'page', 'next', 'skip'] //自定義分頁布局
        ,groups: 1 //只顯示 1 個(gè)連續(xù)頁碼
        ,first: false //不顯示首頁
        ,last: false //不顯示尾頁
        
      }

返回object類型，js會(huì)將這個(gè)類型當(dāng)做json數(shù)據(jù)

@SuppressWarnings("null")
	@RequestMapping(value = "userlist")
	@ResponseBody
	public Object userlist(HttpServletRequest request, HttpServletResponse response) {
		//分頁
		String pageNo=request.getParameter("page");
		String pagesize=request.getParameter("limit");
		String uname=request.getParameter("selectValue");
		HashMap map=new HashMap();
		map.put("pageNo", (Integer.valueOf(pageNo)-1));
		map.put("pagesize", pagesize);
		//查詢總數(shù)量
		List listsize = user.findAll();
		//分頁傳參page<當(dāng)前頁>和limit<顯示數(shù)據(jù)條數(shù)>
		List list=null;
		try {
			list = user.selectAlllist((Integer.parseInt(pageNo)-1)*Integer.parseInt(pagesize),Integer.parseInt(pagesize));
		} catch (Exception e) {
			// TODO Auto-generated catch block
			e.printStackTrace();
		}
		System.out.println("條數(shù)："+list.size());
		Map result = new HashMap();
		int count = listsize.size();  
		JSONArray json = JSONArray.fromObject(list);  
		String js=json.toString();
        //*****轉(zhuǎn)為layui需要的json格式，必須要這一步，博主也是沒寫這一步，在頁面上數(shù)據(jù)就是數(shù)據(jù)接口異常  
        String jso = "{\"code\":0,\"msg\":\"\",\"count\":"+count+",\"data\":"+js+"}"; 
        System.out.println(jso); 
        return jso;
   
	}

對(duì)應(yīng)的sql

select uid,uname,upass,sex,age,constellation,unative,national,labeltext from user where 1=1   limit #{pageNo},#{pagesize}

以及dao方法的傳參

  public 	List selectAlllist(
    		@Param("pageNo") Integer pageNo
    		,@Param("pagesize") Integer pagesize);

daoimpl的實(shí)現(xiàn)

@Override
	public List selectAlllist(Integer pageNo, Integer pagesize) {
		// TODO Auto-generated method stub
		return user.selectAlllist(pageNo,pagesize);
	}

service的實(shí)現(xiàn)

public List selectAlllist(Integer pageNo, Integer pagesize);

serviceimpl的實(shí)現(xiàn)

@Override
	public List selectAlllist(Integer pageNo, Integer pagesize) {
		// TODO Auto-generated method stub
		return usi.selectAlllist(pageNo,pagesize);
	}

感謝你能夠認(rèn)真閱讀完這篇文章，希望小編分享layui如何實(shí)現(xiàn)分頁內(nèi)容對(duì)大家有幫助，同時(shí)也希望大家多多支持創(chuàng)新互聯(lián)，關(guān)注創(chuàng)新互聯(lián)行業(yè)資訊頻道，遇到問題就找創(chuàng)新互聯(lián)，詳細(xì)的解決方法等著你來學(xué)習(xí)!