Question

这应该通过单击在开和关之间切换，但不会重新打开。：（

我已经尝试过对/错语句以及g--;和g++;（或g-=1;和g+=1;）

    var toggle=true;
    var g = 1;
    draw=function() {
       if (mouseIsPressed&&g===1){
            toggle=true;
            g=2;
       }
       if (mouseIsPressed&&g===2) {
            toggle=false;
            g=1;
       }
       if(toggle===true){
            background(255, 255, 255);
            fill(255, 0, 255);
            text('('+ mouseX + ',' + mouseY+')',mouseX,mouseY);
        }
        if(toggle===false){
            background(255,255,255);
            text('(off)',mouseX,mouseY);
        }
    };

我希望它能在单击时切换，但仅停留在第二步。

Answer 1

第二个if语句将始终为true，因为第一个语句设置了g=2。这是一个简化的示例：

var mouseIsPressed = true;
var g = 1;
var toggle = false;

if (mouseIsPressed && g === 1) {
  console.log('inside first `if`');
  toggle = true;
  console.log('set toggle =', toggle);
  g = 2;
  console.log('set g =', g);
}
if (mouseIsPressed && g === 2) {
  console.log('inside second `if`');
  toggle = false;
  console.log('set toggle =', toggle);
  g = 1;
  console.log('set g =', g);
}

您可以看到两个if语句都已执行。

您要改用else if：

if (mouseIsPressed && g === 1) {
  toggle = true;
  g = 2;
} else if (mouseIsPressed && g === 2) {
  toggle = false;
  g = 1;
}

但是，如果您实际上没有将g用于其他任何事情，而只想切换toggle的值，则可以执行以下操作：

if (mouseIsPressed){
  toggle = !toggle;
}

Answer 2

只需添加和删除CSS类：

let toggle = false

document.addEventListener("click", function(e) {
  if (toggle) {
    document.getElementById("main").classList = "on"
  } else {
    document.getElementById("main").classList = "off"
  }
  const onOff = toggle ? "(off)" : "(on)"
  document.getElementById("main").innerHTML = onOff + " " + e.clientX + ", " + e.clientY
  toggle = !toggle
})

#main {
  width: 100px;
  color: white;
  height: 100px;
}

.on {
  background: blue;
}

.off {
  background: red;
}

<div id="main"></div>

我该如何解决（应该切换为“切换”）

2 个答案: