2016-09-27 21 views
1

我找到了一個small plugin,它允許我將簡單的頁面添加到我的html表格中。TypeError:children.size不是jQuery的函數

我做的第一件事就是創建一個新的js文件並向它添加下面的代碼。

(function ($) { 

    $.fn.SimplePages = function (opts) { 
     var self = this; 

     var defaults = { 
      perPage: 10, 
      showPrevNext: false, 
      hidePageNumbers: false 
     }; 

     var settings = $.extend(defaults, opts); 

     var listElement = self; 
     var perPage = settings.perPage; 
     var children = listElement.children(); 
     var pager = $('.pager'); 

     if (typeof settings.childSelector != "undefined") { 
      children = listElement.find(settings.childSelector); 
     } 

     if (typeof settings.pagerSelector != "undefined") { 
      pager = $(settings.pagerSelector); 
     } 

     var numItems = children.size(); 
     var numPages = Math.ceil(numItems/perPage); 

     pager.data("curr", 0); 

     if (settings.showPrevNext) { 
      $('<li><a href="#" class="prev_link">«</a></li>').appendTo(pager); 
     } 

     var curr = 0; 
     while (numPages > curr && (settings.hidePageNumbers == false)) { 
      $('<li><a href="#" class="page_link">' + (curr + 1) + '</a></li>').appendTo(pager); 
      curr++; 
     } 

     if (settings.showPrevNext) { 
      $('<li><a href="#" class="next_link">»</a></li>').appendTo(pager); 
     } 

     pager.find('.page_link:first').addClass('active'); 
     pager.find('.prev_link').hide(); 
     if (numPages <= 1) { 
      pager.find('.next_link').hide(); 
     } 
     pager.children().eq(1).addClass("active"); 

     children.hide(); 
     children.slice(0, perPage).show(); 

     pager.find('li .page_link').click(function() { 
      var clickedPage = $(this).html().valueOf() - 1; 
      goTo(clickedPage, perPage); 
      return false; 
     }); 
     pager.find('li .prev_link').click(function() { 
      previous(); 
      return false; 
     }); 
     pager.find('li .next_link').click(function() { 
      next(); 
      return false; 
     }); 

     function previous() { 
      var goToPage = parseInt(pager.data("curr")) - 1; 
      goTo(goToPage); 
     } 

     function next() { 
      goToPage = parseInt(pager.data("curr")) + 1; 
      goTo(goToPage); 
     } 

     function goTo(page) { 
      var startAt = page * perPage, 
       endOn = startAt + perPage; 

      children.css('display', 'none').slice(startAt, endOn).show(); 

      if (page >= 1) { 
       pager.find('.prev_link').show(); 
      } 
      else { 
       pager.find('.prev_link').hide(); 
      } 

      if (page < (numPages - 1)) { 
       pager.find('.next_link').show(); 
      } 
      else { 
       pager.find('.next_link').hide(); 
      } 

      pager.data("curr", page); 
      pager.children().removeClass("active"); 
      pager.children().eq(page + 1).addClass("active"); 

     } 
    }; 

}(jQuery)); 

然後我想使用這個插件,像這樣

$(function() { 

    $('#UserToClientRelationTable').SimplePages(
    { 
     pagerSelector: '#UserToClientRelationTablePager', 
     showPrevNext: true, 
     hidePageNumbers: false, 
     perPage: 5 
    }); 

}); 

遺憾的是這段代碼一直給我

TypeError: children.size is not a function

而且,是我之前加載jQuery的控制檯以下錯誤加載這個文件。面對面,如果我刪除這段代碼和分頁,我的代碼的其餘部分不會給我帶來任何錯誤。

我該如何解決這個問題?

回答

8

size()是很久以前棄用,完全從jQuery的3

除去範數是使用length屬性,而不是

size() docs

如果您使用的版本少於3,那麼問題可能在其他地方,我們需要更多信息

+0

謝謝。成功了! –