带有动态内容的页面上的jQuery脚本

我使用两个jQuery的脚本过滤它们

//Load more // less 
    $(document).ready(function() { 
    $('#article-list article:gt(10)').hide(); 
    $('#loadMore').click(function() { 
    $('#article-list article:hidden:lt(2)').show(); 
     }); 
    }); 
    //hide articles with no image 
    $('.myClass').each(function(){ 
     if($(this).attr('src') === ""){ 
      $(this).closest('article').hide(); 
     } 
    });

在第一负载没关系我看到10篇文章全部用图像。

但是，当我点击加载更多它加载2多篇文章，但我看到没有图像的文章。

我如何结合这两个代码，这样，当我点击加载更多隐藏无图像

来源

2015-02-10 em0tic0n

src属性可能不存在 – 2015-02-10 23:48:39

它存在，如果我删除加载更多的脚本它会隐藏没有图像的文章。 – em0tic0n 2015-02-10 23:50:10

如果您缩进了代码，您将会看到，每个循环的最后一段代码都在DOM就绪处理程序之外。这个代码是否在头部，如果是这样的话，你必须把这个循环放在DOM就绪处理器中 – adeneo 2015-02-10 23:52:14

你可以给没有图像的文章在一些

类和过滤器

$(document).ready(function() { 
    $('#article-list article:gt(10)').hide(); 
    $('#loadMore').click(function() { 
     $('#article-list article:not(.noimg):hidden:lt(2)').show(); 
    }); 
    //hide articles with no image 
    $('.myClass').each(function(){ 
     if($(this).attr('src') === ""){ 
     $(this).closest('article').addClass('noimg').hide(); 
     } 
    }); 
    });

来源

2015-02-11 00:10:14 Musa

你知道你需要重复使用的物品，所以写一个函数：

function hideArticlesWithNoImages(){ 
    $('.myClass').each(function(){ 
     if($(this).attr('src') === undefined || $(this).attr('src') === ''){ 
     $(this).closest('article').hide(); 
     } 
    }); 
}

然后引用它：

$(document).ready(function() { 
    $('#article-list article:gt(10)').hide(); 
    $('#loadMore').click(function() { 
     $('#article-list article:hidden:lt(2)').show(); 
     hideArticlesWithNoImages(); 
    }); 
    hideArticlesWithNoImages(); 
});

来源

2015-02-10 23:58:13 Drifter

带有动态内容的页面上的jQuery脚本

回答

相关问题