Question

我有similar problem，但我使用的是纯粹的js。根据我的理解，在我点击div后，它应该开始打印＆＃39; Mousemove事件已经发生＆＃39;每次我将光标移动到div上时进入控制台但实际上它只发生一次，当我点击奇怪的div时，因为click不是mosemove。你能帮助我理解这种行为吗？

＆＃13;

<div style="width:100px; height:100px; border:solid black 1px" onclick="handleClick(event)"></div>
  <script>
    let div = document.getElementsByTagName('div')[0];

    function handleClick(event){
      div.addEventListener('onmousemove', handleMove(event));
    }

    function handleMove(event){
      console.log('Mousemove event has occurred');
    }
  </script>

＆＃13;

＆＃13; 看起来它会忽略此部分div.addEventListener('onmousemove', handleMove(event));并改为执行handleMove(event);：

＆＃13;

<div style="width:100px; height:100px; border:solid black 1px" onclick="handleClick(event)"></div>
  <script>
    let div = document.getElementsByTagName('div')[0];

    function handleClick(event){
      handleMove(event);
    }

    function handleMove(event){
      console.log('Mousemove event has occurred');
    }
</script>

＆＃13;

更新：我想在没有handleMove的情况下传递()但是被Atom IDE搞糊涂了（由于苍白的亮点），so do not let Atom confuse you!

Answer 1

看起来它忽略了这个部分div.addEventListener（＆＃39; onmousemove＆＃39;，handleMove（event））;并执行handleMove（event）;代替：

是的，因为这是你写的;）

Worksheets("Sheet1").Range(Cells(2,7), Cells(6,last_col)).ClearContents

上面执行div.addEventListener('onmousemove', handleMove(event));函数传递handleMove。

将它与实际创建事件处理程序（event之后没有括号）进行比较：

＆＃13;

handleMove

＆＃13;

此外：该活动为mousemove而非onmousemove。

Answer 2

事件监听器应该是“mousemove”而不是“onmousemove”。像这样的东西：

<div style="width:100px; height:100px; border:solid black 1px" onclick="handleClick(event)"></div>
  <script>
    let div = document.getElementsByTagName('div')[0];

    function handleClick(event){
      div.addEventListener('mousemove', function(event) { handleMove(event) });
    }

    function handleMove(event){
      console.log('Mousemove event has occurred');
    }
  </script>

Answer 3

如果你看一下addEventListener的语法document.addEventListener(event, function, useCapture)这里参数event清楚地提到（here）

必需。一个String，指定事件的名称。

注意：请勿使用“on”前缀。例如，使用“click”而不是“onclick”。

所以将'onmousemove'替换为'mousemove'

<div style="width:100px; height:100px; border:solid black 1px" onclick="handleClick(event)"></div>
  <script>
    let div = document.getElementsByTagName('div')[0];
    
    function handleClick(event){
      div.addEventListener('mousemove', handleMove);
    }

    function handleMove(event){
      console.log('Mousemove event has occurred');
    }
  </script>

Onclick事件

3 个答案: