jquery - `$container.imagesLoaded is not a function`错误

因此，我收到了$container.imagesLoaded is not a function错误。

这是位于 header 中的代码:

(function ($, root, undefined) {

    $(function () {

    'use strict';
    ////

    var $container = $('.grid');

        $container.imagesLoaded(function(){
          $container.masonry({
            itemSelector: '.grid-item',
            columnWidth: 100
          });
        });

        $container.infinitescroll({
          navSelector  : '#rh_nav_below',
          nextSelector : '#rh_nav_below .rh_nav_next a',
          itemSelector : '.grid-item',
          loading: {
              finishedMsg: 'No more pages to load.',
              img: 'http://i.imgur.com/6RMhx.gif'
            }
          },
          function( newElements ) {
            var $newElems = $( newElements ).css({ opacity: 0 });
            $newElems.imagesLoaded(function(){
              $newElems.animate({ opacity: 1 });
              $container.masonry( 'appended', $newElems, true );
            });
          }
        );

    ////

});

})(jQuery, this);

然后页脚具有以下js文件:

    <script type="text/javascript" src="http://example.com/js/masonry.pkgd.min.js"></script>
    <script type="text/javascript" src="http://example.com/jquery.infinitescroll.min.js"></script>

有什么我想念的吗？引起问题的文件的位置？

谢谢你。

编辑1

以下内容位于页脚，脚本由匿名函数传递。
但是仍然出现相同的错误。

    <script type="text/javascript" src="http://example.com/js/masonry.pkgd.min.js"></script>
    <script type="text/javascript" src="http://example.com/jquery.infinitescroll.min.js"></script>
    <script type="text/javascript">
    (function($) {
        var $container = $('.grid');

            $container.imagesLoaded(function(){
              $container.masonry({
                itemSelector: '.grid-item',
                columnWidth: 100
              });
            });

            $container.infinitescroll({
              navSelector  : '#rh_nav_below',
              nextSelector : '#rh_nav_below .rh_nav_next a',
              itemSelector : '.grid-item',
              loading: {
                  finishedMsg: 'No more pages to load.',
                  img: 'http://i.imgur.com/6RMhx.gif'
                }
              },
              function( newElements ) {
                var $newElems = $( newElements ).css({ opacity: 0 });
                $newElems.imagesLoaded(function(){
                  $newElems.animate({ opacity: 1 });
                  $container.masonry( 'appended', $newElems, true );
                });
              }
            );
    })(jQuery);
    </script>

最佳答案

imagesLoaded在3.0.0版中与Masonry无关。您必须单独包含它。 http://imagesloaded.desandro.com/