有没有办法按类过滤所有先前的元素?

时间:2019-05-27 14:39:59

标签: javascript jquery masonry

我有一个带有 ul / li 元素的砌体画廊。为了使它们具有响应性,我将每个“ li ”元素的列号添加为一个类,以便稍后进行排序。

在添加新元素之前,我试图在列中获取以前的元素高度。所以基本上是新的 li 元素之前的列高。

我正在使用 prevAll()来获取所有先前的元素,但是我无法将高度计算和过滤列结合在一起。因此,尝试使用 each(),过滤器和更改的选择器来实现这一点,我添加了部分代码。

var that= this;
that.prevAll = $(this).prevAll();


that.top += $(this).prevAll('.column' + that.current_column).height(); 
// selector

that.top += that.prevAll.filter('.column' + that.current_column).height(); 
// filter

that.prevAll.each(function(){
  if(that.prevAll.hasClass('.column' + that.current_column)) {
  that.top += that.prevAll.height() + that.settings.imegesGap;
 };            
});
// .each

DOM

jQuery

 $this.addClass('column' + that.current_column);
 $this.addClass('row' + that.row);

HTML

<ul class="mosaic1">
    <li ><img src="img/test.png"></li>
    <li ><img src="img/test6.jpg"></li>
    <li ><img src="img/test4.jpg"></li>
    <li ><img src="img/test.3.jpg"></li>
    <li ><img src="img/test7.jpg"></li>
    <li ><img src="img/test5.png"></li>
</ul>

“每个”功能的主要问题。它不断地总结。

P.S。这是我的第一个问题,对不起,如果描述不够好。

1 个答案:

答案 0 :(得分:0)

所以主要的问题是每个功能,它工作不正确,因为我没有在乞讨时重置that.top。所以正确的方法是这样

var that= this;
that.prevAll = $(this).prevAll();
that.top = 0;

that.prevAll.each(function(){
  if(that.prevAll.hasClass('.column' + that.current_column)) {
   that.top += that.prevAll.height() + that.settings.imegesGap;
  }; 
enter code here