Проблемы с бесконечным прокруткой и кладкой jQuery

Question

Я пытаюсь создать тему tumblr, и я использую кладки и бесконечные плагины прокрутки для jquery. кладка работает отлично. однако я не могу заставить бесконечный свиток работать вообще. вот мой JQuery код:

<script type="text/javascript" src="../jquery-1.7.2.min.js"></script> 
<script type="text/javascript" src="../masonry.js"></script> 
<script type="text/javascript" src="../jquery.infinitescroll.js"></script> 
<script type="text/javascript"> 
$('document').ready(function(){ 
$('#content').imagesLoaded(function(){ 
$('#content').masonry({ 
itemSelector: '.post', 
columnWidth: 260}); 
}); 
$('#content').infinitescroll({ 
    navSelector : '#nav', 
    nextSelector : '#nav a', 
    itemSelector : '#content div.post',   
    }, 
    function(newElements) { 
    var $newElems = $(newElements); 
    $('#content').masonry('appended', $newElems, function(){$newElems.fadeIn('slow');} ); 
    }); 
}); 
</script> 

и это мой HTML:

<div id="content"> 
    {block:Posts} 
    {block:Photo} 
<div class="post"> 
<img src="{PhotoURL-250}" width="250" /> 
</div> 
    {/block:Photo} 
    {/block:Posts} 
{block:Pagination} 
<div id="nav">{block:NextPage}<a href="{NextPage}"></a>{/block:NextPage}</div> 
{/block:Pagination} 

Любая помощь очень ценится. заранее спасибо.

* Я также хотел бы отметить, что я укоротил URL-адреса в файлах js специально для того, чтобы сообщение выглядело лучше, в моей фактической теме URL-адреса верны.

Это то, что консоль появится после того, как я добавил отладки (честно говоря я не знаю, что это значит, но надеюсь, что это помогает)

Testing console 
["determinePath", 
Array[2] 
0: "/page/" 
1: "" 
length: 2 
__proto__: Array[0] 
] jquery.infinitescroll.js:171 
["Binding", "bind"] jquery.infinitescroll.js:171 
["math:", 77, 644] jquery.infinitescroll.js:171 
["heading into ajax", 
Array[2] 
0: "/page/" 
1: "" 
length: 2 
__proto__: Array[0] 
] jquery.infinitescroll.js:171 
["Using HTML via .load() method"] jquery.infinitescroll.js:171 
["contentSelector", 
<div id=​"content" style=​"position:​ relative;​ height:​ 689px;​ " class=​"masonry">​…​</div>​ 
] jquery.infinitescroll.js:171 
["math:", 292, 644] jquery.infinitescroll.js:171 
["heading into ajax", 
Array[2] 
] jquery.infinitescroll.js:171 
["Using HTML via .load() method"] jquery.infinitescroll.js:171 
["Error", "end"] jquery.infinitescroll.js:171 
["Binding", "unbind"] 

Answer 1

Некоторые браузеры пресловутый для поддержки только подмножество window.console или даже совсем нет. Некоторые браузеры поддерживают только console.info, в то время как другие поддерживают информацию, отладочную информацию, журнал, предупреждение, ошибку и, возможно, другие.

В jquery.infinitescroll.js файле, на или около линии 171, вы увидите следующий код:

// Console log wrapper 
    _debug: function infscr_debug() { 

     if (this.options && this.options.debug) { 
      return window.console && console.log.call(console, arguments); 
     } 

    }, 

В Internet Explorer, метод консоли не иногда не определен, если Застройщика Инструменты и/или функции отладки сценариев включены; таким образом, веб-приложение, которое отлично работает на компьютере разработчика, может потерпеть неудачу при использовании на рабочем компьютере, где средства разработчика и/или отладчик сценариев отключены.

Ваш первый инстинкт как разработчик может состоять в том, чтобы удалить инструкции консоли из вашего кода - или код любых библиотек, которые вы используете, используя console.log. Хуже того, у вас может возникнуть соблазн избегать консольных заявлений algoether и вместо этого использовать предупреждения.

Поскольку инструкции console.log очень ценны для процесса устранения неполадок и отладки, один метод, который вы можете использовать для обеспечения того, чтобы инструкции консоли не мешали производственному коду, заключается в том, чтобы включить определение по умолчанию для объекта консоли на всех на ваших веб-страницах, где возникает эта проблема:

Этот JavaScript, включенный в раздел ваших страниц, будет определять window.console и его методы как пустые функции, если он обнаружит, что они не были определены.

<script type="text/javascript"> 
// override loggers to avoid throwing errors 
if(window.console == null || window.console == undefined || !window.console) { 
      console = { log: function() {}, info: function() {}, warn: function() {}, error: function() {}, trace: function() {}, debug: function() {} }; 
      //var fbscript = document.createElement("script"); 
      //fbscript.src = "https://getfirebug.com/firebug-lite-beta.js"; 
      //fbscript.setAttribute("type","text/javascript"); 
      //document.getElementsByTagName("head")[0].appendChild(fbscript); 
} else if(!console.debug) { 
     console.debug = function(text) { if(console.log) console.log("D: "+text); }; 
} 
</script> 

Кроме того, есть 4 линии комментировал JavaScript, что, когда раскомментирована будет загружать Firebug Lite в любом браузере вы работаете, если window.console является нулевым или не определено.

В качестве альтернативы, вы можете проверить, чтобы убедиться, что у вас нет отладка включена в разделе параметров самого JQuery Бесконечные прокрутки плагин:

 debug  : true,       
      // enable debug messaging (to console.log) 

В идеале, это, вероятно, будет лучшим решением, но я предпочитаю первое, поскольку я знаю, что это помогает мне избежать ловушки не тестировать в браузерах без отладчиков.

Подробнее см. В разделе jQuery Ininite Scroll documentation, в частности, раздел «Опции».