javascript “event”已被弃用，应该使用什么？

2ic8powd 于 2023-03-21 发布在 Java

关注(0)|答案(4)|浏览(3023)

我使用的是一个找到的代码，其中使用了“事件”。它的工作，但我想知道应该使用什么。
我是一个新手程序员，有一个概念，我错过了。在这种情况下，我使用的代码，我发现在网络上，可以在下一个链接中找到：https://codepen.io/galulex/pen/eNZRVq
phpStorm告诉我onmousemove=“zoom（event）”上的“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 + '%';
}

JavaScript

来源：https://stackoverflow.com/questions/58341832/event-is-deprecated-what-should-be-used-instead

4条答案

按热度按时间

9bfwbjaz1#

全局对象的event属性（在Web浏览器中通常为window）最初是由Microsoft在Internet Explorer中添加的。正如经常发生的那样，它随后逐渐进入其他流行的Web浏览器，并成为另一个事实上的“标准”，而当时没有被W3C或类似的权威机构正式指定。
最终，WHATWG以向后兼容的名义追溯性地指定了它，将其定义为“当前”事件，并附上警告说明：
强烈建议Web开发人员改为依赖于传递给事件侦听器的Event对象，因为这将导致更可移植的代码。此属性在工作进程或工作小程序中不可用，并且对于在影子树中调度的事件不准确。
因此，对于您的用例所属的大类问题，惯用的解决方案是在元素或其祖先上附加一个事件侦听器（通常使用addEventListener函数），并使用显式传递给侦听器的事件对象。
在您的特定情况下，假设下面的figure引用了您的figure元素，则事件侦听器（zoom）可以这样附加：

figure.addEventListener("mousemove", zoom);

由于zoom函数已经假设传递给它的单个参数是鼠标移动事件，因此它将继续作为事件侦听器工作，而不需要更改-每次鼠标移动时，它将使用感兴趣的事件作为唯一参数进行调用。

赞(0）回复(0）举报 2023-03-21

sc4hvdpw2#

我得到这个错误的VS代码，而使用它这样

document.addEventListener("keydown", function()
{
     console.log(event); 
});

使用以下代码解决了警告

document.addEventListener("keydown", function(event)
{
     console.log(event); 
});

原因-事件处理函数中缺少event参数，最终使用了global window.event，该函数脆弱且已弃用。

赞(0）回复(0）举报 2023-03-21

webghufk3#

你也可以这样做（在react中），

<input type="file" onChange={event => handleFileChange(event)} />

赞(0）回复(0）举报 2023-03-21

gpnt7bae4#

我也有同样的问题。我发现这个code对我很有效，就像以前的事件一样。

function hide(e){
  e.currentTarget.style.visibility = 'hidden';
  console.log(e.currentTarget);
  // When this function is used as an event handler: this === e.currentTarget
}

var ps = document.getElementsByTagName('p');

for(var i = 0; i < ps.length; i++){    
  // Console: print the clicked <p> element 
  ps[i].addEventListener('click', hide, false);
}
// Console: print <body>
document.body.addEventListener('click', hide, false);

// Click around and make paragraphs disappear

赞(0）回复(0）举报 2023-03-21

我来回答

javascript “event”已被弃用，应该使用什么？

4条答案

相关问题

热门标签

最新问答