0

我正在使用这个 jquery 解决方案来过滤我的内容（以及 jpages 和lazyload） - http://luis-almeida.github.io/filtrify/jpages.html

它工作得很好，但我注意到当元素超过 50 个时会出现一些减速。页面加载后，过滤器本身运行速度很快，但页面加载时间有点过长。

我想知道是否有办法阻止加载元素（在这种情况下是 div），而不仅仅是不可见的图像？

这可以用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();
}); 
});
4

2 回答 2

0

试试看，不确定它是否适用于您的情况：

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

  var container = $("#itemListLeading"),
  ...
});
于 2013-06-21T09:37:34.943 回答
0

这是最终代码，但不幸的是它破坏了过滤器功能。我之前没有清除缓存:(

<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();
});

});

于 2013-06-25T11:14:18.313 回答