Question

如何使用jQuery在每次点击时以反向（降序）顺序从特定元素中选择'n'个连续元素？

在下面的示例中，我想在第一次单击时选择（addClass）这些， <li> 2nd 4</li> <li> 2nd 4</li> <li> 2nd 4</li> <li> 2nd 4</li>

这些在第二次点击时， <li> 1st 4</li> <li> 1st 4</li> <li> 1st 4</li> <li> 1st 4</li>

和第三个 <li> 4th 4</li> <li> 4th 4</li> <li> 4th 4</li> <li> 4th 4</li>

提前多多感谢。

$(document).ready(function(){
var n = 0;
  $(".btn").on('click', function(){
    $("li")
    .removeClass("selected")
    .slice(n, n += 4)
    .addClass("selected");
    if (n >= $("li").length) n = 0;
  });
});

.btn{ text-decoration:none; background:blue; color:#fff; padding:5px; border-radius:4px;float:left;}
ul{ list-style:none;float:left;clear:both;}
ul li{ padding:5px;background:#555; color:#fff; float:left; border-radius:2px; margin:2px; }
.selected{ background:red;}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js"></script>
<a class="btn">select prev 4 consecutive elements</a>
<ul>
  <li> 1st 4</li>
  <li> 1st 4</li>
  <li> 1st 4</li>
  <li> 1st 4</li>
  <li> 2nd 4</li>
  <li> 2nd 4</li>
  <li> 2nd 4</li>
  <li> 2nd 4</li>
  <li class="selected"> 3rd 4</li>
  <li class="selected"> 3rd 4</li>
  <li class="selected"> 3rd 4</li>
  <li class="selected"> 3rd 4</li>
  <li> 4th 4</li>
  <li> 4th 4</li>
  <li> 4th 4</li>
  <li> 4th 4</li>
</ul>

点击第一个按钮，第二个点击下一个4点，然后点击第三个点击第三个点击，直到'n'个数字。

Answer 1

检查以下代码。希望它对你有用!!

$(document).ready(function() {
var n = 0;
  $(".btn").on('click', function(){
  if (n > $("li").length)
  	n=$("li").length+1;
  else
  	n=$("li.selected:eq(1)")?$("li.selected:eq(1)").index():n;
    $("li")
    .removeClass("selected")
    .slice(n-5, n-1)
    .addClass("selected");
    if (n <= 5 || n > $("li").length)
    {
    n = n <= 5 ? $("li").length+1: $("li").length-4;
    }
  });
});

.btn{ text-decoration:none; background:blue; color:#fff; padding:5px; border-radius:4px;float:left;}
ul{ list-style:none;float:left;clear:both;}
ul li{ padding:5px;background:#555; color:#fff; float:left; border-radius:2px; margin:2px; }
.selected{ background:red;}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<a class="btn">select prev 4 consecutive elements</a>
<ul>
  <li> 1st 4</li>
  <li> 1st 4</li>
  <li> 1st 4</li>
  <li> 1st 4</li>
  <li> 2nd 4</li>
  <li> 2nd 4</li>
  <li> 2nd 4</li>
  <li> 2nd 4</li>
  <li class="selected"> 3rd 4</li>
  <li class="selected"> 3rd 4</li>
  <li class="selected"> 3rd 4</li>
  <li class="selected"> 3rd 4</li>
  <li> 4th 4</li>
  <li> 4th 4</li>
  <li> 4th 4</li>
  <li> 4th 4</li>
</ul>

Answer 2

List<String> pathsToTheFile = new ArrayList<>();

C:\123\456\NameOfUniqueFolder0
C:\123\456\NameOfUniqueFolder1
C:\123\456\NameOfUniqueFolder2
C:\123\456\NameOfUniqueFolder3
C:\123\456\NameOfUniqueFolder4

C:\123\456\NameOfUniqueFolder0

如何使用jQuery在每次单击时以反向（降序）顺序从特定元素中选择'n'个连续元素？

2 个答案: