jQuery获取大于特定大小的元素内的所有图像

所以我有一个图像占位符，我想在大于70px宽度或高度的DIV元素中加载HTML中的第一个图像。 然后提供下一个和上一个链接以加载大于70px的下一个图像。

我知道jQuery有一个next＆prev选择器，但我不确定如何将它与下一个和上一个链接联系起来或指定一个图像大小。

Answer 1

要将所有图像放大到某个尺寸，您可以使用以下内容：

 var allImages = $('img', yourDivElement) var largeImages = allImages.filter(function(){ return ($(this).width() > 70) || ($(this).height() > 70) }) 

获得next /上next并不难：

 var nextElement = $(imgElement).nextAll().filter(function(){ return ($(this).width() > 70) || ($(this).height() > 70) }).eq(0); 

如果您有大量图像，以前的示例可能会过度杀伤，因此您可能希望以这种方式循环使用它们：

 var nextElement, nextSilblings = $(imgElement).nextAll(); for (var i=0;i 70) || ($(nextSilblings[i]).height() > 70)){ nextElement = nextSilblings[i]; break; } } 

Answer 2

分两步完成：

1）标记符合标准的图像

 $('#targetDiv img').each(function() { if($(this).height()>70) { $(this).addClass('biggie') } }) 

2）连接导航

 var myPos = 0; $('#btnNext').click(function() { //copy this image to the placeholder $('#placeholder').attr('src', $('#targetDiv .biggie').eq(myPos).attr('src')); myPos++; if(myPos>$('#targetDiv .biggie').length) { myPos = 0; } }) 

…执行前一个按钮的保存，除了减少和更改零逻辑。