向if语句添加事件监听器

Adding eventlisteners to if statement

本文关键字：事件 监听器 添加 语句 if      更新时间：2023-09-26

我想知道您是否可以将onmouseover + onmouseout添加到Javascript中的if/else语句中，例如:

function pan() {
        var ID = document.getElementById("grad");
        var change = ID.style.backgroundSize = "1200px 500px";
        var revert = ID.style.backgroundSize = "1080px 300px";
        if (){
            change.addEventListener("onmouseover");
        }else {
            revert.addEventListener("onmouseout");
        }
    }

我找遍了所有地方，没有看到一个明确的是或否，除非是在jQuery中，我甚至还没有看过jQuery，所以请不要在jQuery中给出答案。

如果有可能，你会怎么做?

否则，有什么选择?

这是可能的，但你的代码是不正确的，这里更正的代码:

     function pan() {
        var ID = document.getElementById("grad");
        var change = ID.style.backgroundColor = "red";
        var revert = ID.style.backgroundColor = "black";
        if( true){
            ID.addEventListener("mouseover", function(){alert("EVENT OVER")});
        }else {
            ID.addEventListener("mouseout", function(){alert("EVENT OUt")});
        }
    }

你只能在元素上绑定事件。

以下是addEventListener函数的一些文档https://developer.mozilla.org/en-US/docs/Web/API/EventTarget/addEventListener

但是我假设您想要做这样的事情(我使用backgroundColor，这样示例可以更好地看到):

var ID = document.getElementById("grad");
function change (event){
  event.target.style.backgroundColor = "red";
}
function revert (event){
  event.target.style.backgroundColor = "white";
}
ID.addEventListener("mouseover", change);
ID.addEventListener("mouseout", revert);
<div id="grad" style="border:1px solid black">sdfgsdfg</div>

相关文章：