Question

我正在使用jQuery索引。在这里，我需要根据当前索引添加和删除div。

我想要的是当我的当前索引大于7时我需要删除前四个div，并且当我的当前索引小于四（4）时，我需要再次显示那些删除前四个div。

我使用：lt（4）隐藏前四个div。但我不知道如何让它回来展示。

先谢谢

＆＃13;

$(window).load(function() {

  $(document).keydown(function(e) {
	  if (e.keyCode == 37){

		 


	  }
	  else if (e.keyCode == 39){

		 


	  }
	  else if (e.keyCode == 40){

		  var cIndex = $('.foo.active').index();
      
          if(cIndex > 7) {

              $('.test').find('.foo:lt(4)').remove();

          }


	  }
	   else if (e.keyCode == 38){

		  var cIndex = $('.foo.active').index();
      
          if(cIndex < 4) {

              $('.test').find('.foo:lt(4)').add();

          }


	  }
  });
  
});

＆＃13;

.test {
  width: 420px;
  height: 200px;
  text-align: center;
}

.foo {
  width: 100px;
  height: 100px;
  line-height: 100px;
  display: inline-block;
  background: #ccc;
  margin-bottom: 4px;
}

.foo.active {
  background: #565656;
  color: #fff;
}

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div class="test">
    <div class="foo active">1</div>
    <div class="foo">2</div>
    <div class="foo">3</div>
    <div class="foo">4</div>
    <div class="foo">5</div>
    <div class="foo">6</div>
    <div class="foo">7</div>
    <div class="foo">8</div>
    <div class="foo">9</div>
    <div class="foo">10</div>
    <div class="foo">11</div>
    <div class="foo">12</div>
</div>

＆＃13;

Answer 1

您可以将类hide添加到您要隐藏的元素中，然后当您想要显示它们时使用该类并选择它们，就像这样：

$('.foo:lt(4)').addClass('hide').fadeOut();
// when you show them back
$('.foo.hide').removeClass('hide').fadeIn();

show hide根据当前索引jquery隐藏div

1 个答案: