如何使用Javascript向每个下拉选项卡添加唯一的数字

我有一个下拉列表，其中每个项目都将关闭，直到您单击该特定项目

HTML:

每个droptab都有一个不同的编号。这在HTML中工作得很好，但我想在Wordpress中使用它，因为我不能手动为每个选项卡分配一个数字，当单击一个选项卡时，它们都会打开

有谁能解释一下我怎样才能使数字自动递增

非常感谢，

---

Jason。

使用泛型遍历。在事件处理程序中，此是事件发生的元素，从该元素开始，您可以遍历到相应的匹配元素

$（'.drop a'）。单击（函数（）{
var$content=$（this.parent（）.next（）.show（200）
$（'.droptab'）。不是（$content）。隐藏（200）；
});
.droptab{
显示：无
}

主标题
主要标题内容

第二名
第二题内容

您已经拥有了几乎所有的代码：请看示例：

在本例中，我们不再需要
id
s，而是使用相应的索引进行选择和显示


//在索引上选择而不是在ID上选择
功能下拉选项卡（已选择选项卡）{
//选择将单击的元素与其节点列表进行比较的索引号
$（'div.droptab'）。每个（函数（索引）{
if（$（this.index（'div.droptab'）==selectedtab）{
元(此),show(200);；
}否则{
$（此）.hide（600）；
}
});
}
//分配单击事件
$（'h2.drop>a'）。打开（“单击”，函数（e）{
//选择将单击的元素与其节点列表进行比较的索引号
下拉列表（$（this）.index（“h2>a”）；
});

要显示的文本

要显示的文本


<div id="dropdowntabs">
  <h2 class="drop">
    <a id="tabhead1" href="javascript:dropdowntabs('droptab1');">MAIN TITLE</a>
  </h2>
  <div name="droptab" class="droptab" id="droptab1" style="display:none;">
    <p>TEXT TO SHOW</p>
  </div>
</div>

function dropdowntabs(selectedtab) {
   $('div[name|="droptab"]').each(function(index) {
      if ($(this).attr("id") == selectedtab) {
         $(this).show(200);
      }
      else {
         $(this).hide(600);
      }
   });
}