javascript - 从 getElementsByClassName 集合获取索引值

<分区>

如何获取getElementsByClassName集合的索引值。

function clickSchedule(){
    var t = document.getElementsByClassName("table")    
    for(i=0; i<=t.length; i++)
    {
        t[i].onclick= function() {

            // get the index value of the node when clicked something like this
            // alert(t[i].index)
            // already tried alert(t[i]) returning undefined.
            // already tried alert(t.item(i)) returning NULL.
    };
    }
}
window.onload = function(){
    clickSchedule();    
};

最佳答案

第一个问题是您需要修复 <= 的使用在循环中，它导致你的循环迭代太多次(解释未定义的消息)。改为<不是<= :

for(i=0; i<t.length; i++)

您似乎只想在单击事件中获取元素的句柄。在这种情况下，this上下文将引用被点击的元素。

t[i].onclick= function() {
    console.log( this );
}

如果你真的需要索引那么你需要一个闭包，否则i到任何点击事件发生时，将始终是最后一次迭代。

闭包示例:

for(i=0; i<t.length; i++){
    (function(protectedIndex){
        t[i].onclick= function() {
            console.log( t[protectedIndex] );
        }
    })(i);
}

备注:document.querySelectorAll比 document.getElementsByClassName 有更好的浏览器支持所以你可以更改为:

var t = document.querySelectorAll(".table")

关于javascript - 从 getElementsByClassName 集合获取索引值，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/29775765/

上一篇：javascript - React 缺少 onClick？

下一篇：javascript - 可点击的侧边栏 markerclusterer google map api v.3

相关文章：

javascript - react JS |渲染多个元素

javascript - 转换在 Javascript 中不起作用

javascript - 在具有多个提交按钮的表单中提交带有回车按钮的表单

javascript - 如何在 onmousedown 事件中更改所选行的颜色

javascript - 如何使用 .then() 在 javascript 中实现一个又一个函数

javascript - 如何突出显示特定日期的日期并使用 keith-wood 日历在悬停时显示事件？

JavaScript - 如何在文本框的右侧放置星号？

javascript - 如何进行 knex.js 迁移？

javascript - 表格每个单元格上的动态工具提示文本

javascript - 更喜欢 {foo : bar} or {foo : bar} (extra space after :) style in Javascript