使用Jquery来获取偶数/ ODD,偶数/ ODD,偶数/ ODD对

时间:2019-09-28 20:45:36

标签: jquery

我正在尝试根据<p>标签的类名来抓取偶数,奇数对的几个<p>标签。我正在尝试使用的代码示例:

CSS

body p{
 display: none;
}

HTML :(我的解决方案不能具有id属性,并且它们都必须具有相同的类名)

<p class="storyline">Random sentence one</p>
<p class="storyline">Random sentence two</p>
<p class="storyline">Random sentence three</p>
<p class="storyline">Random sentence four</p>
<p class="storyline">Random sentence five</p>
<p class="storyline">Random sentence six</p>
<p class="storyline">Random sentence seven</p>

JQUERY

$( document ).ready(function() {

 // getting several <p> tags with the same class name
 $(".storyline").each(function(index) {

   //Need to grab,  even/odd  even/odd  even/odd,  to be faded in until either, none left, or fade in last individual item
   $(this).delay(1000*index).fadeIn('slow').delay(3000);
});
});

目前,我只能分别加载每个<p>标签。我希望加载索引点,[0][1] [2][3] [4][5]等对,以此类推,直到没有剩余的东西或需要单独加载的独立项目为止。

如果有人可以帮助您,将不胜感激。

1 个答案:

答案 0 :(得分:0)

在这里找到了可行的方法.. https://stackoverflow.com/a/2358665/10896569

已更改代码以满足我的需要:

$(document).ready(function(){
  var p; 
  p=true; 
  $('p.storyline:even').each(function(index){
    var t=$(this);
    var paired = t.add( $('p.storyline:eq('+(t.index()+1)+')', t.parent()) );
  //call function
    if (p){p=true;paired.delay(3000*index).fadeIn('slow').delay(2000).fadeOut('slow').addClass('greenc');}
    else  {p=false; paired.delay(3000*index).fadeIn('slow').delay(2000).fadeOut('slow').addClass('redc');}
  });
});