jQuery filtrify с разбивкой на страницы, можно ли не загружать скрытые элементы?

Question

Я использую это JQuery решения для фильтрации моего содержания (наряду с jpages и LazyLoad) - http://luis-almeida.github.io/filtrify/jpages.html

Она работает довольно хорошо, но я заметил, что некоторые замедления, когда есть больше чем 50 элементов. После того, как страница загрузила фильтр, он работает быстро, но страница загружается слишком долго.

Я хотел выяснить, есть ли способ предотвратить загрузку элементов (в этом случае divs), а не только изображения, которые не видны?

Можно ли это сделать с помощью jquery?

Финальный код я использую

$(function() { 

var container = $("#itemListLeading"), 
    pagination = $("#pagination"); 

function setLazyLoad() { 
    container.find("img").lazyload({ 
     event : "turnPage", 
     effect : "fadeIn" 
    }); 
}; 

function setPagination() { 
    pagination.jPages({ 
     containerID : "itemListLeading", 
     perPage : 9, 
     direction : "auto", 
     animation : "fadeInUp", 
     previous : "a.jprev", 
     next  : "a.jnext", 
     callback : function(pages, items){ 
      items.showing.find("img").trigger("turnPage"); 
      items.oncoming.find("img").trigger("turnPage"); 
     } 
    }); 
}; 

function destroyPagination() { 
    pagination.jPages("destroy"); 
}; 

setLazyLoad(); 
setPagination();  

var ft = $.filtrify("itemListLeading", "placeHolder", { 
    close: true, // Close windows after tag select 
    block : "data-original", 
    callback: function (query, match, mismatch) { 

     if (mismatch.length) $("div#reset").show(); // Show Reset 
     else $("div#reset").hide(); 

     $('.ft-label').parent() // Hide unrelated tags 
      .find('li[data-count=0]').hide().end() 
      .find(':not(li[data-count=0])').show().end(); 

     $(".ft-selected li").css("display","inline-block"); // small tag display fix 

     destroyPagination(); 
     setPagination(); 

    } 
}); 

$("div#reset span").click(function() { // Make reset button clickable 
    ft.reset(); 
}); 
}); 

Answer 1

Попробуйте, что не уверен, что это может быть применить в вашем случае:

$(function() { 
    $('div:hidden').remove(); 

    var container = $("#itemListLeading"), 
    ... 
}); 

Answer 2

Это окончательный код, но, к сожалению, она нарушает функциональность фильтра. Я не очистил свой кеш до :(

<script type="text/javascript"> 
$(function() { 
$('div:hidden').remove(); 

var container = $("#itemListLeading"), 
    pagination = $("#pagination"); 

function setLazyLoad() { 
    container.find("img").lazyload({ 
     event : "turnPage", 
     effect : "fadeIn" 
    }); 
}; 

function setPagination() { 
    pagination.jPages({ 
     containerID : "itemListLeading", 
     perPage : 9, 
     direction : "auto", 
     animation : "fadeInUp", 
     previous : "a.jprev", 
     next  : "a.jnext", 
     callback : function(pages, items){ 
      items.showing.find("img").trigger("turnPage"); 
      items.oncoming.find("img").trigger("turnPage"); 
     } 
    }); 
}; 

function destroyPagination() { 
    pagination.jPages("destroy"); 
}; 

setLazyLoad(); 
setPagination();  

var ft = $.filtrify("itemListLeading", "placeHolder", { 
    close: true, // Close windows after tag select 
    block : "data-original", 
    callback: function (query, match, mismatch) { 

     if (mismatch.length) $("div#reset").show(); // Show Reset 
     else $("div#reset").hide(); 

     $('.ft-label').parent() // Hide unrelated tags 
      .find('li[data-count=0]').hide().end() 
      .find(':not(li[data-count=0])').show().end(); 

     $(".ft-selected li").css("display","inline-block"); // small tag display fix 

     destroyPagination(); 
     setPagination(); 

    } 
}); 

$("div#reset span").click(function() { // Make reset button clickable 
    ft.reset(); 
}); 

});