2017-03-03 112 views
0

我正在使用twbsPagination,并且遇到以下问题。twbsPagination插件问题

onPageClick在我销毁并初始化诸如totalpages之类的新选项后,事件永远不会触发。

这里是我的代码:

function ShowPages(update, TotalPages) { 

     if (update) { 

      var $pagination = $('#pagination'); 
      var defaultOpts = { 
       totalPages: 10 
      }; 

      var currentPage = $pagination.twbsPagination('getCurrentPage'); 
      $pagination.twbsPagination('destroy'); 
      $pagination.twbsPagination($.extend({}, defaultOpts, { 
       startPage: currentPage, 
       totalPages: TotalPages, 
       first: '<span> <i class="ace-icon fa fa-angle-double-left bigger-140"></i> </span>', 
       prev: '<span> <i class="ace-icon fa fa-angle-left bigger-150"></i></i></span>', 
       next: '<span> <i class="ace-icon fa fa-angle-right bigger-150"></i></i></span>', 
       last: '<span> <i class="ace-icon fa fa-angle-double-right bigger-140"></i></span>' 
      })); 
     } 
     else { 
      $('#pagination').twbsPagination({ 
       totalPages: TotalPages, 
       visiblePages: 7, 
       first: '<span> <i class="ace-icon fa fa-angle-double-left bigger-140"></i> </span>', 
       prev: '<span> <i class="ace-icon fa fa-angle-left bigger-150"></i></i></span>', 
       next: '<span> <i class="ace-icon fa fa-angle-right bigger-150"></i></i></span>', 
       last: '<span> <i class="ace-icon fa fa-angle-double-right bigger-140"></i></span>', 
       onPageClick: function (event, page) { 
        GetMyTasks(page); 
        } 
      }); 
     } 

    } 

回答

0

destroy方法完全破坏你的插件,这意味着你的点击事件的回调也被破坏(onPageClick事件)。所以尝试在销毁插件后添加回调。 例如:

function ShowPages(update, TotalPages) { 

     if (update) { 
      var $pagination = $('#pagination'); 
      var currentPage = $pagination.twbsPagination('getCurrentPage'); 
      $pagination.twbsPagination('destroy'); 
      renderPagination(currentPage, TotalPages) 
     } 
     else { 
      renderPagination(1, TotalPages) 
     } 

    } 
    function renderPagination(currentPage, totalPages) { 
     $('#pagination').twbsPagination({ 
      startPage: currentPage, 
      totalPages: totalPages, 
      initiateStartPageClick: false, 
      onPageClick: function (event, page) { 
       GetMyTasks(page); 
      } 
     }); 
    } 

小心initiateStartPageClick选项,默认为:

消防点击开始页面时,插件初始化 从Official doc