在javascript中,我们如何检测表格的哪一行被点击?目前我正在做的是,我正在像这样在运行时绑定(bind)方法。

onload = function() {
    if (!document.getElementsByTagName || !document.createTextNode) return;
    var rows = document.getElementById('my_table').getElementsByTagName('tbody')[0].getElementsByTagName('tr');
    for (i = 0; i < rows.length; i++) {
        rows[i].onclick = function() {
            alert(this.rowIndex + 1);
        }
    }
}

[复制自 [http://webdesign.maratz.com/lab/row_index/]]

但我不喜欢这种方法。有什么替代方法吗?我的问题只是获取单击的行的索引。
  • 请不要使用 jQuery :D。
  • 最佳答案

    你可以使用 event delegation 。基本上,您向表中添加了一个 clickhandler。这个处理程序读出被点击元素的标记名并向上移动 DOM 树,直到找到包含行。如果找到一行,它会对其进行操作并返回。类似的东西(尚未测试,但可能会给您一些想法):

        var table = document.getElementById('my_table');
        table.onclick = function(e) {
           e = e || event;
           var eventEl = e.srcElement || e.target,
               parent = eventEl.parentNode,
               isRow = function(el) {
                         return el.tagName.match(/tr/i));
                       };
    
           //move up the DOM until tr is reached
           while (parent = parent.parentNode) {
               if (isRow(parent)) {
                 //row found, do something with it and return, e.g.
                  alert(parent.rowIndex + 1);
                  return true;
               }
           }
           return false;
       };
    

    关于javascript - 如何检测单击了哪一行 [tr]?,我们在Stack Overflow上找到一个类似的问题:https://stackoverflow.com/questions/1824206/

    10-12 12:31
    查看更多