按钮不会保持关闭[关闭]答案

【问题标题】：Button won't stay OFF [closed]按钮不会保持关闭[关闭]
【发布时间】：2016-01-25 15:04:09
【问题描述】：

我已经设置好了，所以当提示按钮为“ON”时，目标将在您开始拖动项目时突出显示。这工作正常。但是，当我一开始拖动项目时将按钮切换到“OFF”，按钮就会返回到“ON”位置并突出显示目标区域。按钮如何保持“关闭”而不突出显示？这是按钮代码（小提琴中的完整代码）

function onoff() {
currentvalue = document.getElementById('onoff').value;
if (currentvalue == "Off") {
  document.getElementById("onoff").value = "On";
} else {
  document.getElementById("onoff").value = "Off";
}
}

这是 jsfiddle Button won't stay OFF

【问题讨论】：

if((document.getElementById("onoff").value="On") 您在这里分配了一个值，而不是进行比较。使用==（或===）代替=。
它的工人在小提琴
仅供参考，从不使用多个<h1> 标签，这不是正确的 HTML 设计，更好的实现是使用您当前为您的 <h1> 拥有的容器并为其分配一个类，然后应用CSS 样式以获得您想要的外观
onoff 怎么叫？
是的，我同意@James Thrope。以第 96 行为例。所以每次你认为你在检查它是否打开时，你实际上是在将值重新分配给 on。

标签： javascript html

【解决方案1】：

为了切入主题，在您的 Fiddle 中，函数 ondragstart 有一堆条件进行赋值，例如：document.getElementById("onoff").value="On"，用于比较值，您应该使用 ==，并用于存储值和类型，你应该使用===。

这是在您的 ondragstart 函数中应该是这样的：

if((document.getElementById("onoff").value === "On") && (data === "item1" || data === "item2" || data === "item3" || data === "item4")){
  (document.getElementById("fruit").style.color = "red") && (document.getElementById("veg").style.color = "black") && (document.getElementById("games").style.color = "black");
}
else if((document.getElementById("onoff").value === "On") && (data === "item5" || data === "item6" || data === "item7" || data === "item8")){
  (document.getElementById("veg").style.color = "red") && (document.getElementById("fruit").style.color = "black") && (document.getElementById("games").style.color = "black");
}
else if((document.getElementById("onoff").value === "On") && (data === "item9" || data === "item10" || data === "item11" || data === "item12")){
  (document.getElementById("games").style.color = "red") && (document.getElementById("fruit").style.color = "black") && (document.getElementById("veg").style.color = "black");
}
else if((document.getElementById("onoff").value === "Off") &&  (data === "item1" || data === "item2" || data === "item3" || data === "item4" || data === "item5" || data === "item6" || data === "item7" || data === "item8" || data === "item9" || data === "item10" || data === "item11" || data === "item12")){
  (document.getElementById("fruit").style.color = "black") && (document.getElementById("veg").style.color = "black") && (document.getElementById("games").style.color = "black");
}

【讨论】：