Question

我试图做的是让一个表格单元格元素监听一个onclick（）事件，当这个事件被唤起时，做一些事情，然后将另一个键盘事件监听器添加到这个表格单元格元素，但它确实即使添加了新的事件监听器，似乎也无法工作。

我有一个由html标签创建的10 x 10表，每个表分配一个0到99的id。

这是我的代码：

    for(i=0; i<100; i++){
        var cell = document.getElementById(i);
        cell.addEventListener("click", handleClick);
    }

    function handleClick(e){
        var cell = e.target;
        console.log(cell);
        cell.addEventListener("keyup", handleInput);
        console.log(true);

        cell.removeEventListener("click", handleClick);
        console.log(true);                       
    }

    function handleInput(e){
        var key = e.keyCode;
        var i = e.target.id;
        console.log(key);
        document.getElementById(i).innerHTML = key;
        }

当我按下单元格上的某个键时，不会调用handleInput（）函数，此外，控制台显示“真实”＆＃39;单击一个单元格后两次。

有谁能告诉我这有什么问题吗？以及如何解决它以实现我的目标。非常感谢。

Answer 1

按原样工作。

<html>
  <table>
    <td><input id="0"></td>
  </table>
  <div id="output"></div>
</html>

For Each ctl In {gbGrbl, gbJogging, gbGcode}
     ctl.Location = New Point(3, ctl.Location.Y)
Next

Answer 2

问题是您将键盘事件侦听器附加到静态html元素。您可以将tabindex添加到td元素，如下所示：

<td tabindex="0">something<td>

结帐this question。

Reference - SCR29: Adding keyboard-accessible actions to static HTML elements

HTML元素侦听一个事件，然后侦听另一个事件

2 个答案: