javascript - 从 Javascript 数组获取索引

标签 javascript php html arrays

如何在 JavaScript 中获取所选元素或“elems[i]”的索引?我知道这是一个非常简单的问题,因此任何有关购买书籍或学习类(class)的建议将不胜感激。谢谢!

代码:

<html>
<body>
    <table>
    <tr id="subject"><?php 
    $subjects = array("IT","Programming","Networks");
    foreach($subjects as $key => $value) {
    echo "<td>"."<a href='index.php' class='column'>".$value."</a>"."</td>";
    }     
  ?></tr>
    </table>
</body>


<script type="text/javascript">

    var elems = document.getElementsByClassName('column');
    for (var i = 0; i < elems.length; i++) {
        elems[i].onclick = function () {
            console.log(this.innerHTML);
        };
    }

</script>

最佳答案

 var elems = document.getElementsByClassName('column'); 
 for (var i = 0; i < elems.length; i++) { 
 let a=i;//the magic happens
 elems[i].onclick = function () { 
console.log(a);
 }; 
 } 

请参阅闭包、let、ES6。

选项二(适用于旧版浏览器):

     var elems = document.getElementsByClassName('column'); 
 for (var i = 0; i < elems.length; i++) { 
 (function(){
 var a=i;
 elems[i].onclick = function () { 
console.log(a);
 }; 
 })();
 } 

您需要将索引放入处理程序作用域中,可以使用 block 作用域(让,第一个答案),也可以通过 IIFE 创建新作用域... (您需要为每个处理程序创建一个自己的范围)

解决方案3: 设置 dom 对象 id:

elems[i].id=i;
elems[i].onclick=function(){
  alert(this.id);
};

解决方案 4: 动态获取索引:

alert(elems.indexOf(this));

关于javascript - 从 Javascript 数组获取索引,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/41323178/

相关文章:

javascript - 内部请求失败导致父请求失败

JavaScript 下拉菜单。并非所有选项和选择标签都显示

javascript - HTML 5 Canvas/requestAnimationFrame 在 Safari 7.0 中损坏了吗?

html - 如何使用 C 将 HTML 解析为 .txt 格式

javascript - 未捕获的类型错误 : Object #<HTMLDivElement> has no method 'offset'

javascript - 有人能发现问题吗?只有第一个选项适用于选择

javascript 封装 - 有什么方法可以访问给定实例的私有(private)成员?

php - 根据用户输入安全地调用函数

php - WordPress:安装后更改语言

phpunit 测试资源 laravel 5.5 返回集合而不是 json