gpt4 book ai didi

当 html onmouseenter 执行时,javascript mouseenter 不触发

转载 作者:行者123 更新时间:2023-11-29 11:00:28 24 4
gpt4 key购买 nike

当使用上面的代码时,“mouseenter”和“mouseleave”在开始时被触发一次。“onmouseenter”和“onmouseleave”在预期时被触发。如何让“mouseenter”和“mouseleave”在预期时触发?

<!DOCTYPE html>
<html>
<body>
<div id="banner" style="border: 2px solid black; height: 200px"></div>
<div style="border: 2px solid black; height: 200px"></div>
<script>
var banner = document.getElementById("banner");

banner.setAttribute("onmouseenter", 'console.log("onmouseenter")');
banner.setAttribute("onmouseleave", 'console.log("onmouseenter")');
banner.addEventListener("mouseenter", console.log("mouseenter"));
banner.addEventListener("mouseleave", console.log("mouseleave"));

</script>
</body>
</html>

最佳答案

事件监听器接受一个函数它将在事件发生时触发。目前您正在立即调用 console.log,而不是等待事件触发。如果将控制台日志放在一个函数中,则不会发生这种情况。

banner.addEventListener("mouseenter", function() {
console.log("mouseenter");
});

banner.addEventListener("mouseleave", function() {
console.log("mouseleave");
});

附带说明一下,这是本周我第二次看到 setAttributeonclick 一起使用。我建议不要使用该方法并坚持使用 addEventListener

关于当 html onmouseenter 执行时,javascript mouseenter 不触发,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/47968525/

24 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com