Question

我设法模拟嵌套在标签内的幻灯片 - 标签中最后一张幻灯片上的下一个按钮可以带您进入下一个标签。

我已经使用n-child选择器完成了它 - 但是我必须为每个第n个孩子填写一个函数 - 例如：

if (nth-child(1)) {}; 
else if (nth-child(2)) {}; 
else is (nth-child(3)){;

等等

有没有办法为第n个子选择器使用一系列值 - 类似于：

 if (nth-child(1-3){};

或

  if (nth-child(1,2,3){};

类似的东西。

完整代码在这里http：here

谢谢！

Answer 1

还有一种方法可以选择具有以下选择器的索引以来的所有项目：

$(':nth-child(n3)').addClass('test');

在此示例中，第二个之后的所有项目都将受到影响。

Answer 2

可以使用index函数 -

Demo

示例 -

var index = $(this).index('#slideshow li');
if(index < 3) {
     $('#tab1').addClass('active');
     $('#tab2').removeClass('active');
     $('#tab3').removeClass('active');
}
else if(2 < index && index < 6) {
     $('#tab1').removeClass('active');
     $('#tab2').addClass('active');
     $('#tab3').removeClass('active');
}
else if(index > 5) {
     $('#tab1').removeClass('active');
     $('#tab2').removeClass('active');
     $('#tab3').addClass('active');
}

Answer 3

确定！

使用index()方法：http://jsfiddle.net/fPvJK/8/

var selector = "#tab" + (Math.floor($(this).index()/3)+1);
$("#tab1, #tab2, #tab3").removeClass("active");
$(selector).addClass("active");

根据{{1}}的{{1}} - 树中的位置，

$(this).index()为0-index。

如果我们说dom中有3号元素：（parent）

childNode

选择器是：

0-index = 2

如果我们在dom中采用第7个元素：Math.floor(2/3) +1 = Math.floor(0,67) + 1 = 0 + 1 = 1;

#tab1

这会给我们

0-index = 6

或者我们只能Math.floor(6/3) + 1 = 2 + 1 = 3而不是var selector = "#tab3";：）

Math.ceil

Math.floor向下舍入，Math.ceil向上舍入，Math.round舍入到最近：

Math.floor + 1

注意：使用var selector = "#tab" + Math.ceil($(this).index()/3); $("#tab1, #tab2, #tab3").removeClass("active"); $(selector).addClass("active");并Math.floor(2.1); // 2 Math.floor(2.9); // 2 Math.ceil(2.1); // 3 Math.ceil(2.9); // 3 Math.round(2.1); // 2 Math.round(2.9); // 3向上舍入。

round

使用第n个子选择器的范围 - 清理一些代码

3 个答案: