Получение ошибки в контейнере Masonry.append Uncaught TypeError: объект не имеет фильтра метода

Question

Я реализую бесконечный прокрутки на своей веб-странице, на которой отображаются изображения. Изображения выравниваются с помощью masonry. Первоначально, когда страница загружается, я помещаю 10 изображений только в #container div. И все изображения выравниваются правильно, используя код ниже, без ошибок в консоли chrome script.

var $container = $('#container'); 
     $container.imagesLoaded(function(){ 
     $('#container').masonry({ 
      itemSelector: '.box', 
      columnWidth: 200, 
      isAnimated: true 
     }); 
    }); 

но, как пользователь прокручивает вниз я

$.ajax({ 
     url: "load.php?offset="+1+"&quantity="+1, 
     success: function(html){ 
     if(html){ 
        var $container = $('#container'); 
        var $test = "<div>even doing this causes error </div>"; 
       $container.append($test).masonry('appended',$test); 
     } 
    }); 

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

Uncaught TypeError: Object <div class....... </div> has no method filter 

Answer 1

Как я изложил в своем комментарии, сообщение об ошибке, которое вы получаете, типично при работе с jQuery. filter() - это метод объектов jQuery. кладка, похоже, пытается называть его любым объектом внутри вашей переменной $test, которая в вашем примере является объектом String. В принципе, он называет

"<div>even doing this causes error </div>".filter(...) 

который производит вашу ошибку.

Чтобы все работало, вы должны передать метод masonry() объекту jQuery вместо String (или любого другого объекта JavaScript). Если у вас есть строка, например. в результате вызова AJAX вы можете преобразовать его в объект jQuery, используя функцию jQuery. Для вашего примера:

$test = $("<div>even doing this causes error </div>"); 

Это создает div-объект jQuery, который должен использоваться с кладкой.

Еще один намек: вы, кажется, приписываете все свои переменные JavaScript знаку $. Хотя это зависит от вас, я бы рекомендовал префикс только для переменных, которые содержат объекты jQuery с $ и не префикс каких-либо других переменных. Итак, для Strings вы просто используете var test = "String";. Это соглашение, которое я нашел весьма полезным. Кроме того, это облегчит для других людей понимание вашего кода.