本文主要為大家詳細介紹了jqPaginator結合express實現分頁展示內容效果，具有一定的參考價值，有興趣的小伙伴們可以參考一下，希望能幫助到大家。
寫在前面的話
分頁展示內容也是我們在頁面開發中經常會遇到的需求
前端頁面利用jqPaginator這個jquery插件來編寫
後端利用mysql儲存資料
開始敲程式碼
#回顧sql知識
首先讓我們回顧一下sql語句，我們只想查詢出資料表裡的某幾條用limit實作
select * from 表名limit [offset,] rows
#其中，limit後面可以跟兩個參數，也可以跟一個參數。
跟著一個參數表示rows，相當於offset=0,從資料表中的第一筆記錄開始查詢出rows筆資料。
跟兩個參數的話，第一個是從0開始的偏移量，第二個參數表示想查詢出來的記錄數。
利用jqPaginator這個優秀的jquery分頁外掛程式寫一個分頁條
注意：這個分頁是基於bootstrap3.1.1寫出來的
<!DOCTYPE html>
<html>
<head>
<link type="text/css" rel="stylesheet" href="http://cdn.staticfile.org/twitter-bootstrap/3.1.1/css/bootstrap.min.css"/>
</head>
<body>
<p style="text-align: center;">
<ul class="pagination" id="pagination1"></ul>
</p>
</body>
<script src="/javascripts/jquery.min.js"></script>
<script src="/javascripts/jqPaginator.js"></script>
<script>
$.jqPaginator('#pagination1', {
totalPages: 100,
visiblePages: 3,
currentPage: 1,
onPageChange: function (num, type) {
if (type == 'change') {
//这里是点击分页的回调
}
}
});
</script>
</html>
這裡我們可以方便的把分頁按鈕寫出來
後台程式碼
router.get('/pages', function (req, res, next) {
// res.json({"name": 123});
var page = req.query.page;
var page = (--page)*5;
var connection = mysql.createConnection({
host: '127.0.0.1',
port: 3306,
user: 'root',
password: 'root',
database: 'vr02'
});
connection.connect(function(err) {
if (err) {
throw err;
}
console.log('连接数据库成功');
});
connection.query('select * from user limit ?, 5',当前1/2页 12下一页阅读全文相關推薦：
以上是jq Paginator結合express實現分頁效果的詳細內容。更多資訊請關注PHP中文網其他相關文章！
