layui分頁效果實(shí)現(xiàn)代碼
更新時間:2017年05月19日 10:09:07 作者:廣信_劉東君
這篇文章主要為大家詳細(xì)介紹了layui前段框架分頁效果的實(shí)現(xiàn)代碼,具有一定的參考價值,感興趣的小伙伴們可以參考一下
本文實(shí)例為大家分享了layui分頁效果的具體代碼,供大家參考,具體內(nèi)容如下
<!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>開門見山 : 默認(rèn)分頁</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 //總頁數(shù) ,groups: 5 //連續(xù)顯示分頁數(shù) }); laypage({ cont: 'demo5' ,pages: 100 ,curr: location.hash.replace('#!fenye=', '') //獲取hash值為fenye的當(dāng)前頁 ,hash: 'fenye' //自定義hash值 }); laypage({ cont: 'demo7' ,pages: 100 ,skip: true }); }); </script> </body> </html>
效果圖:
官網(wǎng)分頁
以上就是本文的全部內(nèi)容,希望對大家的學(xué)習(xí)有所幫助,也希望大家多多支持腳本之家。
您可能感興趣的文章:
- layUI實(shí)現(xiàn)前端分頁和后端分頁
- layui實(shí)現(xiàn)數(shù)據(jù)分頁功能(ajax異步)
- layui實(shí)現(xiàn)數(shù)據(jù)表格table分頁功能(ajax異步)
- layui實(shí)現(xiàn)數(shù)據(jù)分頁功能
- Layui實(shí)現(xiàn)帶查詢條件的分頁
- layui實(shí)現(xiàn)動態(tài)和靜態(tài)分頁
- 基于LayUI分頁和LayUI laypage分頁的使用示例
- 基于LayUI實(shí)現(xiàn)前端分頁功能的方法
- 深入理解jQuery layui分頁控件的使用
- 基于ssm框架實(shí)現(xiàn)layui分頁效果
相關(guān)文章
JS遮罩層效果 兼容ie firefox jQuery遮罩層
史上最精簡,最強(qiáng)大的JS遮罩層效果,支持ie firefox jQuery遮罩層2010-07-07jQuery插件HighCharts繪制2D餅圖效果示例【附demo源碼下載】
這篇文章主要介紹了jQuery插件HighCharts繪制2D餅圖效果,結(jié)合完整實(shí)例形式分析了jQuery使用HighCharts插件繪制餅圖效果的操作步驟與相關(guān)實(shí)現(xiàn)技巧,并附帶demo源碼供讀者下載參考,需要的朋友可以參考下2017-03-03jQuery zTree 異步加載添加子節(jié)點(diǎn)重復(fù)問題
zTree 是一個依靠 jQuery 實(shí)現(xiàn)的多功能 “樹插件”。下面通過本文給大家分享jQuery zTree 異步加載添加子節(jié)點(diǎn)重復(fù)問題,需要的朋友參考下吧2017-11-11jQuery實(shí)現(xiàn)單擊彈出Div層窗口效果(可關(guān)閉可拖動)
這篇文章主要介紹了jQuery實(shí)現(xiàn)單擊彈出Div層窗口效果,具有可關(guān)閉可拖動的功能,涉及jQuery響應(yīng)鼠標(biāo)事件動態(tài)變換頁面元素樣式的實(shí)現(xiàn)技巧,具有一定參考借鑒價值,需要的朋友可以參考下2015-09-09jQuery根據(jù)ID獲取input、checkbox、radio、select的示例
獲取input、checkbox、radio、select的方法有很多,下面本例為大家介紹下根據(jù)ID來獲取2014-08-08使用jquery獲取url及url參數(shù)的簡單實(shí)例
下面小編就為大家?guī)硪黄褂胘query獲取url及url參數(shù)的簡單實(shí)例。小編覺得挺不錯的,現(xiàn)在就分享給大家,也給大家做個參考。一起跟隨小編過來看看吧2016-06-06