javascript - 当图像元素阻止它时，事件侦听器不起作用

Question

有时我有一个图像元素等于鼠标指针的位置。我很难找到这个。这可能与传播有关？

例如，当图像元素是鼠标光标的位置时，这不会触发，因为它阻塞了另一个元素：

    document.getElementById("playGrid").querySelectorAll('section div').forEach(function(el) {
        el.addEventListener('click', function() {
        console.log("event fired");

    }

我在 div 中的图像元素非常简单：

<div id="playGrid" class="w">

  <img id="stone" style="position:absolute;" src="graphics/redStone.png">

</div>

我的光标 onmousemove 事件设置如下：

document.getElementById("playGrid").onmousemove = function(event) {stoneCursor(event)};

function stoneCursor(e) {

    const stone = document.getElementById("stone");
    let xPosition;
    let yPosition;
    if(e){
        xPosition = e.clientX - 100;
        yPosition = e.clientY - 100;

        stone.style.top = yPosition + 'px';
        stone.style.left = xPosition + 'px';
    }

}

如何让石头忽略点击事件，以便 playGrid 仍然可以获得点击？

标签： javascriptaddeventlistener