时间戳

首页 > 解决方案 > 如何在 foreach 循环中获取单击元素的索引？

javascript - 如何在 foreach 循环中获取单击元素的索引？

问题描述

我正在搜索如何找到在我的 foreach 循环中单击的元素的索引。由于这种类型的 foreach 循环使用不多，因此我找不到有关此特定问题的任何现有主题。

这是我现在的代码（为了清楚起见，css）：

var toggleExtras = document.querySelectorAll(".toggle-extra");

Array.prototype.forEach.call(toggleExtras, function (toggleExtra) {
    toggleExtra.addEventListener('click', function () {
   console.log(index);
  })
});
.toggle-extra {
 background-color: #C9C9C9;
 padding: 10px;
 margin: 20px 0px;
 color: #000;
 width: 200px
 }
<div class="toggle-extra">Title</div>
<div class="toggle-extra">Text</div>
<div class="toggle-extra">Button</div>
<div class="toggle-extra">Link</div>

我在另一个主题中找到了以下代码，这似乎有效；

document.querySelectorAll("button").forEach((button, index) => {
 button.onclick = (event) => {
  console.log("You clicked button number " + index);
 }
})

如何在我的特定 foreach 循环中使用类似此代码的“索引”？我尝试了以下但没有成功；

Array.prototype.forEach.call(toggleExtras, index, function (toggleExtra) {
Array.prototype.forEach.call(toggleExtras, function (toggleExtra), index {

请不要建议我使用不同的 foreach 方法，我需要完全使用这个。有谁知道如何做到这一点？

标签： javascript

解决方案

index 被传递给 forEach 回调，在这里捕获它


Array.prototype.forEach.call(toggleExtras, function (toggleExtra, index) {

推荐阅读