是否可以在 Javascript 中的特定条件下停用 addeventlistener (mouseover/mouseout)？

如何解决是否可以在 Javascript 中的特定条件下停用 addeventlistener (mouseover/mouseout)？

let currentColor = 0

function makeHover () {
        console.log(currentColor);
            svgall.forEach(item => {
                item.addEventListener('mouSEOver',event => {
                    event.target.style.fill = "rgb(168,168,168)";
                    event.target.style.pointerEvents = "all";
                    event.target.style.cursor = "pointer";
                    event.target.style.strokeOpacity = "1";
                    event.target.style.fillOpacity = "0.3";
                    event.target.style.transitionDuration = "0.5s";
                    event.target.style.transitionTimingFunction = "ease-in";
                })
            })

            svgall.forEach(item => {
                item.addEventListener('mouSEOut',event => {
                    event.target.style.fill = "none";
                    event.target.style.stroke = "white";
                    event.target.style.pointerEvents = "all";
                    event.target.style.strokeOpacity = "1";
                    event.target.style.fillOpacity = "0.1";
                    event.target.style.transitionDuration = "0.5s";
                    event.target.style.transitionTimingFunction = "ease-out";
                })
            })
        }

在此代码中，我只想在以下情况下启用悬停效果：

if (currentColor === 0)
        {makeHover ()}

我在 SVG 上使用这种效果，控制台给出 currentColor = 1 当满足另一个设置 currentColor = 1 的条件时。 currentColor = 1时悬停仍然有效，是否可以停用已激活的悬停效果？

解决方法

您只需要将样式包装在 if 语句中：

svgAll.forEach(item => {
  item.addEventListener('mouseover',event => {
    if (currentColor === 0) {
      event.target.style.fill = "none";
      event.target.style.stroke = "white";
      event.target.style.pointerEvents = "all";
      event.target.style.strokeOpacity = "1";
      event.target.style.fillOpacity = "0.1";
      event.target.style.transitionDuration = "0.5s";
      event.target.style.transitionTimingFunction = "ease-out";
    }
  })
})
svgAll.forEach(item => {
  item.addEventListener('mouseout',event => {
    if (currentColor === 0) {
      event.target.style.fill = "none";
      event.target.style.stroke = "white";
      event.target.style.pointerEvents = "all";
      event.target.style.strokeOpacity = "1";
      event.target.style.fillOpacity = "0.1";
      event.target.style.transitionDuration = "0.5s";
      event.target.style.transitionTimingFunction = "ease-out";
    }
  })
})