bootstrap兩端對齊連結實作上一頁下一頁翻頁

效果：

bootstrap 兩端對齊代碼

<ul class="pager">
    <li class="previous"><a href="#"><span aria-hidden="true">&larr;</span> 上一頁</a></li>
    <li class="next"><a href="#">下一頁 <span aria-hidden="true">&rarr;</span></a></li>
  </ul>      

js實作根據條件按鈕不可用

此處判斷時間，如果還沒到就顯示灰色不可用

// {{ next_date }}是django背景傳過來的時間變量，如： 2018-06-30

var next_date = Date.parse("{{ next_date }}" + ' GMT +8');  //解析成時間
var date = new Date();  //目前時間
var now = Date.parse(date);  // 目前時間轉為時間戳
var delta = next_date - now;  //作比較

// 如果delta > 0： 時間比今天超前
// 如果delta < 0： 時間比今天靠後
if(delta > 0){
     next.attr("href", 'javascript:void(0)'); //設定<a>标簽不可用
     $(".next").addClass('disabled');   // 設定 li樣式不可用
 }      

參考：

https://v3.bootcss.com/components/#%E5%AF%B9%E9%BD%90%E9%93%BE%E6%8E%A5