javascript - 无法添加 onmousemove

Question

我有下一张 table :

div class="container">
    <table id="myTable">
    <tr onmousemove="changeVposition(this)">
      <td onmousemove="changeGposition(this)">
        <div class="cell"></div>
      </td>
      <td onmousemove="changeGposition(this)">
        <div class="cell"></div>
      </td>
      <td onmousemove="changeGposition(this)">
        <div class="cell"></div>
      </td>
      <td onmousemove="changeGposition(this)">
        <div class="cell"></div>
      </td>
    </tr>
    <tr onmousemove="changeVposition(this)">
      <td onmousemove="changeGposition(this)">
        <div class="cell"></div>
      </td>
      <td onmousemove="changeGposition(this)">
        <div class="cell"></div>
      </td>
      <td onmousemove="changeGposition(this)">
        <div class="cell"></div>
      </td>
      <td onmousemove="changeGposition(this)">
        <div class="cell"></div>
      </td>
    </tr>
    <tr onmousemove="changeVposition(this)">
      <td onmousemove="changeGposition(this)">
        <div class="cell"></div>
      </td>
      <td onmousemove="changeGposition(this)">
        <div class="cell"></div>
      </td>
      <td onmousemove="changeGposition(this)">
        <div class="cell"></div>
      </td>
      <td onmousemove="changeGposition(this)">
        <div class="cell"></div>
      </td>
    </tr>
    <tr onmousemove="changeVposition(this)">
      <td onmousemove="changeGposition(this)">
        <div class="cell"></div>
      </td>
      <td onmousemove="changeGposition(this)">
        <div class="cell"></div>
      </td>
      <td onmousemove="changeGposition(this)">
        <div class="cell"></div>
      </td>
      <td onmousemove="changeGposition(this)">
        <div class="cell"></div>
      </td>
    </tr>

    </table>
    <button onclick="appendCol()" id ="appendCol"></button>
    <button onclick="appendRow()" id ="appendRow"></button>
    <button onclick="deleteRow()" id="deleteRow"></button>
    <button onclick="deleteCol()" id="deleteCol"></button> 

  </div>

并在创建具有功能的新列期间

function appendCol() {
      var tbl = document.getElementById("myTable")
      var tr = tbl.getElementsByTagName("tr");
      for (i = 0; i < tr.length; i++) {

        var td = document.createElement('td');
        td.onmousemove = changeGposition(this);
        var div = document.createElement('div')
        div.className = "cell"
        tr[i].appendChild(td).appendChild(div)



      }

但它不起作用，onmousemove没有添加

谁知道为什么它不起作用？

注意:用<div>元素它正在工作，我在调用函数后有下一个 DOM

<td onmousemove="changeGposition(this)">
        <div class="cell"></div>
      </td>
<td>
        <div class="cell"></div>
      </td>

Answer 1

当你做的时候

td.onmousemove = changeGposition(this);

它正在调用函数并将返回的内容分配给事件监听器。

应该是

td.onmousemove = function () { changeGposition(this); }