layui分頁效果實現代碼
更新時間：2017年05月19日 10:09:07 作者：廣信_劉東君
這篇文章主要為大家詳細介紹了layui前段框架分頁效果的實現代碼，具有一定的參考價值，感興趣的小伙伴們可以參考一下
本文實例為大家分享了layui分頁效果的具體代碼，供大家參考，具體內容如下
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>分頁</title>
<link rel="stylesheet" href="layui/css/layui.css" >
</head>
<body>
<fieldset class="layui-elem-field layui-field-title" style="margin-top: 20px;">
<legend>開門見山 ： 默認分頁</legend>
</fieldset>
<div id="demo1"></div>
<fieldset class="layui-elem-field layui-field-title" style="margin-top: 50px;">
<legend>開啟 URL hash</legend>
</fieldset>
<div id="demo5"></div>
<fieldset class="layui-elem-field layui-field-title" style="margin-top: 50px;">
<legend>是時候看一下完整功能了！</legend>
</fieldset>
<div id="demo7"></div>
<script src="layui/layui.js"></script>
<script>
layui.use(['laypage', 'layer'], function(){
var laypage = layui.laypage
,layer = layui.layer;
laypage({
cont: 'demo1'
,pages: 100 //總頁數
,groups: 5 //連續(xù)顯示分頁數
});
laypage({
cont: 'demo5'
,pages: 100
,curr: location.hash.replace('#!fenye=', '') //獲取hash值為fenye的當前頁
,hash: 'fenye' //自定義hash值
});
laypage({
cont: 'demo7'
,pages: 100
,skip: true
});
});
</script>
</body>
</html>
效果圖：
官網分頁
以上就是本文的全部內容，希望對大家的學習有所幫助，也希望大家多多支持腳本之家。
相關文章
JS遮罩層效果 兼容ie firefox jQuery遮罩層
史上最精簡，最強大的JS遮罩層效果，支持ie firefox jQuery遮罩層2010-07-07
這篇文章主要介紹了jquery操作復選框checkbox的方法,實例匯總了jQuery針對checkbox進行判斷與賦值的各種常用操作技巧,需要的朋友可以參考下2015-02-02
這篇文章主要為大家詳細介紹了jQuery實現簡單輪播圖效果，文中示例代碼介紹的非常詳細，具有一定的參考價值，感興趣的小伙伴們可以參考一下2020-12-12
jQuery插件HighCharts繪制2D餅圖效果示例【附demo源碼下載】
這篇文章主要介紹了jQuery插件HighCharts繪制2D餅圖效果,結合完整實例形式分析了jQuery使用HighCharts插件繪制餅圖效果的操作步驟與相關實現技巧,并附帶demo源碼供讀者下載參考,需要的朋友可以參考下2017-03-03
jQuery zTree 異步加載添加子節(jié)點重復問題
zTree 是一個依靠 jQuery 實現的多功能 “樹插件”。下面通過本文給大家分享jQuery zTree 異步加載添加子節(jié)點重復問題，需要的朋友參考下吧2017-11-11
這篇文章主要介紹了jQuery實現單擊彈出Div層窗口效果,具有可關閉可拖動的功能,涉及jQuery響應鼠標事件動態(tài)變換頁面元素樣式的實現技巧,具有一定參考借鑒價值,需要的朋友可以參考下2015-09-09
jQuery根據ID獲取input、checkbox、radio、select的示例
獲取input、checkbox、radio、select的方法有很多，下面本例為大家介紹下根據ID來獲取2014-08-08
這篇文章主要介紹了jQuery.Form上傳文件操作,首先需要我們先建立test文件夾，具體代碼內容大家通過本文學習下吧2017-02-02
下面小編就為大家?guī)硪黄褂胘query獲取url及url參數的簡單實例。小編覺得挺不錯的，現在就分享給大家，也給大家做個參考。一起跟隨小編過來看看吧2016-06-06
這篇文章主要介紹了jQuery彈出框代碼封裝DialogHelper的方法,需要的朋友可以參考下2015-01-01