中文字幕av专区_日韩电影在线播放_精品国产精品久久一区免费式_av在线免费观看网站

溫馨提示×

溫馨提示×

您好,登錄后才能下訂單哦!

密碼登錄×
登錄注冊×
其他方式登錄
點擊 登錄注冊 即表示同意《億速云用戶服務條款》

jqPaginator結合express實現分頁展示內容效果第1/2頁

發布時間:2020-09-12 19:56:02 來源:腳本之家 閱讀:133 作者:靳劉杰 欄目:web開發

寫在前面的話

分頁展示內容也是我們在頁面開發中經常會遇到的需求
前端頁面利用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>
 <div >
  <ul class="pagination" id="pagination1"></ul>
 </div>
 
 </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>

jqPaginator結合express實現分頁展示內容效果第1/2頁

這里我們可以方便的把分頁按鈕寫出來

后臺代碼

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',
                        
12下一頁閱讀全文
向AI問一下細節

免責聲明:本站發布的內容(圖片、視頻和文字)以原創、轉載和分享為主,文章觀點不代表本網站立場,如果涉及侵權請聯系站長郵箱:is@yisu.com進行舉報,并提供相關證據,一經查實,將立刻刪除涉嫌侵權內容。

AI

正安县| 比如县| 崇左市| 阿克苏市| 晋中市| 泗洪县| 于都县| 大同县| 扎鲁特旗| 芷江| 井冈山市| 阳泉市| 咸丰县| 抚宁县| 莒南县| 通道| 静海县| 德庆县| 新平| 呼图壁县| 白城市| 朝阳市| 峡江县| 广饶县| 钟祥市| 新蔡县| 诸暨市| 含山县| 河曲县| 克拉玛依市| 广平县| 中卫市| 色达县| 芜湖县| 中西区| 新兴县| 乌鲁木齐县| 平塘县| 普兰店市| 恭城| 龙胜|