Javascript 什么'；我的编辑有什么问题吗？I'；我正在尝试编辑一个扰流板js代码（jQuery）

我试图编辑这个扰流板js代码，添加一个div作为每个扰流板的按钮。以下是原始代码（它使用jQuery）：

函数扰流板切换（）{
var sliderID=“#扰流板滑块”+$（this.attr（“滑块id”）；
如果（$（sliderID.css（“显示”）=“无”）{
$（此）.text（“[-]”）；
$（this.attr（“标题”，“隐藏扰流板”）
}
否则{
$（此）.text（“[+]”）；
$（此）.attr（“标题”，“显示扰流板”）
}
$（sliderID.slideToggle（'fast'）；
}
函数addsporters（）{
$（“div.spoiler-text”）。每个（addBlockSpoiler）；
$（“.block spoiler toggle”）。单击（{“spoiler”：“block”}，spoilerToggle）；
}
扰流器的功能（一）{
$（this.attr（“id”，“扰流板滑块”+i）；
$（“扰流板[+]”）。在（此）之前插入；
}
$（文件）.ready（添加扰流板）；

现在，如果我使用它，所有class=“spoiler text”的div前面都会有一个带有“spoiler”文本的div，并有一个[+]或[-]来打开/关闭显示/隐藏它们。 我正在尝试编辑它，如下所示：

function spoilerToggle() {
  var sliderID = "#spoiler-slider" + $(this).attr("slider-id");
  if($(sliderID).css("display") == "none") {
    $(this).text("[-]");
     $(this).attr("title", "Hide Spoiler")          
  }
  else {
     $(this).text("[+]");
     $(this).attr("title", "Show Spoiler")
  }
  $(sliderID).slideToggle('fast');
}
function addSpoilers() {
  $("div.spoiler-text").each(addBlockSpoiler);
  $(".block-spoiler-toggle").click({"spoiler": "block"}, spoilerToggle);
}
function addBlockSpoiler(i) {
  $(this).attr("id", "spoiler-slider" + i);
  // $("<div class='block-spoiler'>spoiler <span class='block-spoiler-toggle' title='Show Spoiler' slider-id='"+i+"'>[+]</span></div>").insertBefore(this);
  $("div.block-spoiler-toggle").each($("div.block-spoiler-toggle").attr("slider-id", i));
}
$(document).ready(addSpoilers);

函数扰流板切换（）{
var sliderID=“#扰流板滑块”+$（this.attr（“滑块id”）；
如果（$（sliderID.css（“显示”）=“无”）{
$（此）.text（“[-]”）；
$（this.attr（“标题”，“隐藏扰流板”）
}
否则{
$（此）.text（“[+]”）；
$（此）.attr（“标题”，“显示扰流板”）
}
$（sliderID.slideToggle（'fast'）；
}
函数addsporters（）{
$（“div.spoiler-text”）。每个（addBlockSpoiler）；
$（“.block spoiler toggle”）。单击（{“spoiler”：“block”}，spoilerToggle）；
}
扰流器的功能（一）{
$（this.attr（“id”，“扰流板滑块”+i）；
//$（“扰流板[+]”）。在（此）之前插入；
$（“滑块-扰流板-切换”）。每个（$（“滑块-扰流板-切换”）.attr（“滑块id”，i））；
}
$（文件）.ready（添加扰流板）；

这应该可以找到带有class=“block spoiler toggle”的div，将“slider.id=0”或1或2等添加到div中。。使用它们来显示/隐藏我的剧透div。 显然，在我的html页面中，div.spoiler-text和div.block-spoiler-toggle的数量是相同的，因此ID也是相同的

但这不起作用，我不明白为什么。 有人能帮我吗？我的编辑有什么问题

提前感谢：D

编辑： 我的html页面： JSFIDLE：

这应该可以做到。请随意将其转换为函数，并在现有代码中调用它。

如果需要所有div：

$(document).ready(function(){
    alert(  $('div').length  );
    // Or native js:
    alert( document.getElementsByTagName('div').length );
});

---

试试这个简化版

$(function () {
  alert($('div').length);
});

$（函数（）{}）

是

$（文档）.ready（函数（）{}）

所有选择器都使用

document

作为根节点，因此无需指定

$（document）.find（）

---

您的错误在这一行：

$("div.block-spoiler-toggle").each($("div.block-spoiler-toggle").attr("slider-id", i));

该错误是由jQuery的方法必须采用函数这一事实引起的，因此您可能希望：

$("div.block-spoiler-toggle").each(function(){
    $("div.block-spoiler-toggle").attr("slider-id", i))
});

---

发布你的HTML和JSFIDLE怎么样？我很困惑。标题问了一个问题（人们在下面试着回答），但正文问了一个无关的问题。“我遗漏了什么吗？”杰米克是的，对不起，那是另一个问题。我要编辑标题。文本是正确的。@j08691这是我正在尝试的页面。这是JSFIDLE。您有一个语法错误，这就是它不起作用的原因。传递给

的内容。每个
必须是一个函数。检查JSFIDDLE中的javascript控制台只要
$（'div'）有什么问题。长度
？需要整个循环+计数器吗？我投了反对票，因为它比需要的复杂。在大页面上循环while文档可能会非常慢，并且会在一段时间内阻塞浏览器。下面我们要补充一点：如果您想要非常奇特的元素，这种方法可能是首选方法。在某些元素中的元素，还有一些额外的条件和要求，需要使用
each（）
来检查它们with@Martijn它更复杂，但不会阻塞浏览器。选择器的运行速度与
$（'div'）
一样快，对于JavaScript虚拟机来说，单步执行一个简单的count++是一个简单的数学运算。不过，它比需要的复杂得多。选择项上的循环函数将比选择项的属性慢。但我可能错了。
$("div.block-spoiler-toggle").each($("div.block-spoiler-toggle").attr("slider-id", i));

$("div.block-spoiler-toggle").each(function(){
    $("div.block-spoiler-toggle").attr("slider-id", i))
});