вызова JQuery, когда что-то происходит

Question

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

function manipulate(id) { 
    $(id).each(function(){ 
    if($(this).height()>200){ 
     $('#container2').append(this); 
    } else{ 
     $('#container').append(this); 
    }; 
    }); 
}; 

Так что я хочу вызвать эту функцию каждый раз, когда следующий элемент в Контейнерные грузы масонства. Таким образом, он правильно манипулирует объектом. Как мне это сделать?

Обновление: описание масонства

масонства является Java-плагин в том, что, как CSS поплавков вынуждены приспосабливать совершенно + бесконечную прокрутку. Он полностью скрывает все, что не было бы на странице 1, если бы не было бесконечного прокрутки, а затем загружает их, когда это необходимо. Это означает, что моя функция не повлияет на какой-либо из скрытых элементов и должна быть вызвана, когда масонство загружает следующий набор элементов, чтобы они отображались в нужных местах. Это может означать, что, не зная масонства, вы не можете решить мою проблему, но вы все еще можете. A конец, масонство «присоединяет» предметы к контейнеру масонства, а затем «показывает» их. Поэтому я предполагаю, что мне нужно сделать это, добавив их в правильные контейнеры после того, как они были добавлены в контейнер масонства, но до того, как он будет показан.

код Масонство:

$(window).load(function(){ 
    var $wall = $('#container'); 
    $wall.imagesLoaded(function(){ 
    $wall.masonry({ 
     itemSelector: '#entry, #entry_photo', 
     isAnimated : false 
    }); 
    }); 

    $wall.infinitescroll({ 
    navSelector : '#page-nav', 
    nextSelector : '#page-nav a', 
    itemSelector : '.entry, .entry_photo', 
    bufferPx  : 2000, 
    debug   : false, 
    errorCallback: function() { 
     $('#infscr-loading').fadeOut('normal'); 
    }}, 
    function(newElements) { 
     var $newElems = $(newElements); 
     $newElems.hide(); 
     $newElems.imagesLoaded(function(){ 
     $wall.masonry('appended', $newElems,{isAnimated: false}, function(){$newElems.fadeIn('slow');}); 
     }); 
    }); $('.entry').show(500); 
    }); 

Я попытался поставить функцию в кладке блоков и даже в качестве функции $newElems, чтобы увидеть, если он будет работать, когда больше изображений нагрузки, но это не так, и в факт несколько его нарушает.

Как я могу заставить его запускать все новые элементы, загруженные масонством через мой jQuery, чтобы они добавились в правый контейнер?

Answer 1

Так что, используя сказанное в ответах, я перепутал и обнаружил, как это было сделано ... поэтому часть 'appended' в imagesLoaded просто необходимо заменить функцией! Это действительно простой ответ ... Я просто должен был заменить это:

$wall.masonry('appended', $newElems,{isAnimated: false}, 
function(){$newElems.fadeIn('slow');}); 

с этим:

$wall.masonry(manipulate($newElems) ,{isAnimated: false}, 
function(){$newElems.fadeIn('slow');}); 

Проблема решена!

Answer 2

Другая идея - связать действие с jQuery's .on() (http://api.jquery.com/on/). on() связывается и с будущими элементами, предполагая, что они должным образом привязаны к DOM (например, через .append()). Так, например, вы можете привязывать события .click() к элементам, которые еще не созданы.

Наконец-то вы можете сделать аккуратный трюк и сделать. append() активировать событие. Затем присоедините обработчик для этого события к большому контейнеру, где все добавлено, поэтому функция автоматически вызывается. Вот хороший пример этого on append() do something и jsfiddle http://jsfiddle.net/rzRVu/

PS. на боковой панели, я вижу, что функция принимает в качестве входного ID, но затем вы вызываете .each(). Id в html-коде должен быть уникальным.

Обновление. Я пропустил, что вы пытались сделать это должным образом через кирпичную кладку, что точно? Я вижу, что вы вызываете .imagesLoaded() в переменной jQuery, является ли это плагином?

Answer 3

Вы только заявили, что один экземпляр масонства для container, container2 не имеет экземпляра масонства, поэтому он не может бесконечно прокручивать что-либо. Кроме того, ($(this).height()>200) всегда будет ложным, если изображение еще не загружено, оно будет по умолчанию равно undefined -> 0 > 200, что всегда является ложным. Либо вам нужно дождаться загрузки изображения перед его размещением, либо каким-либо образом получить размеры изображения при загрузке содержимого. Вы можете скрыть его по умолчанию и поместить его в container, затем на загруженные изображения, проверить высоту и перенести ее в соответствующий контейнер и показать его.