2016-09-27 7 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 
    }); 

}); 

残念ながら、このコードは、私が前にjQueryをロードはい、コンソールでくれ

TypeError: children.size is not a function

を次のエラーを与え続けるなど、このプラグインを使用しようとしていますこのファイルをロードしています。面白いことに、このコードとページネーションを削除しても、残りのコードでエラーは発生しません。

この問題を解決するにはどうすればよいですか?

答えて

8

size()はノルムが

代わり lengthプロパティを使用することである

を長い時間前に廃止され、完全にjQueryの3から除去されました

参照size() docs

3未満のバージョンを使用している場合は、他の場所に問題がある可能性があります。詳細情報が必要です

+0

ありがとうございました。働いた! –

関連する問題