“事件”已被弃用，应该使用什么来代替？

我正在使用找到的使用"事件"的代码。

我是一名新手程序员，我缺少一些概念。https://codepen.io/galulex/pen/eNZRVq

PhpStorm 向我显示 onmousemove=“zoom(event)” 上的"event"已被弃用。

<figure class="zoom" onmousemove="zoom(event)" style="background-image: url(//res.cloudinary.com/active-bridge/image/upload/slide1.jpg)">
  <img src="//res.cloudinary.com/active-bridge/image/upload/slide1.jpg" />
</figure>

function zoom(e){
  var zoomer = e.currentTarget;
  e.offsetX ? offsetX = e.offsetX : offsetX = e.touches[0].pageX
  e.offsetY ? offsetY = e.offsetY : offsetX = e.touches[0].pageX
  x = offsetX/zoomer.offsetWidth*100
  y = offsetY/zoomer.offsetHeight*100
  zoomer.style.backgroundPosition = x + '% ' + y + '%';
}

答案

这event全局对象的属性（window在 Web 上）最初是由 Microsoft 在 Internet Explorer 中添加的。

最终，WHATWG以向后兼容的名义追溯指定它，将其定义为“当前"事件，并附有警告说明：

强烈鼓励 Web 开发人员转而依赖事件对象传递给事件侦听器，因为这将导致更可移植的代码。影子树。

因此，解决您的用例所属的广泛问题的惯用解决方案是在元素或其祖先上附加一个事件侦听器，通常使用addEventListener函数，并使用显式传递给侦听器的事件对象。

至于您的具体用例，假设figure下面指的是你的井，figure元素，事件监听器（zoom) 可以这样附加::

figure.addEventListener("mousemove", zoom);

自从你的zoom函数已经假设它传递的单个参数是鼠标移动事件，它将继续作为事件侦听器工作，无需更改 - 每次鼠标移动时，都会使用作为唯一参数传递的感兴趣的事件来调用它。

来自: stackoverflow.com

答案#

答案