Question

我不知道为什么下面的代码会取消隐藏目标元素，但不会隐藏它们。列表消息是从websocket接收的。格式为：

"Line, 4, Auto"
"Line, 4, Heat"
"Line, 4, Cool"
"Line, 4, Fan"
"Line, 4, Off"

将列表推入数组矩阵后，我使用切换块输入array [2]的切换块。代码会在适当的时候适当地取消隐藏元素，但不会隐藏它们。

// dummy code
var lines = `Line 4, Heat;Line, 4, Cool;Line, 4, Auto;Line, 4, Fan;Line, 4, Off`.split(";");

lines.forEach(function(msg) {HideUnhide(msg) })

function HideUnhide(msg) {
// end dummy code
  var array = msg.split(',');
  alert(msg)
  switch (array[0]) {
    case "Line":
      switch (Number(array[1])) {
        case 0:
          document.getElementById("Scale").innerHTML = array[2];
          break;
        case 4:
          document.getElementById("Control").innerHTML = array[2];
          test = array[2];
          switch (test.trim()) {
            case "Auto":
                document.getElementById("Hot").style.visibility = "visible";
                document.getElementById("Cold").style.visibility = "visible";
                break;
            case "Heat":
                document.getElementById("Hot").style.visibility = "visible";
                document.getElementById("Cold").style.visibility = "invisible";
                break;
            case "Cool":
                document.getElementById("Hot").style.visibility = "invisible";
                document.getElementById("Cold").style.visibility = "visible";
                break;

              default:
                document.getElementById("Hot").style.visibility = "invisible";
                document.getElementById("Cold").style.visibility = "invisible";
                break;
          }
      }
  }
}

div.Hot {
  position: fixed;
  top: 75px;
  left: 24px;
  width: 100px;
  font: 20px Arial Bold;
  color: rgb(200, 200, 200);
}

div.Cold {
  position: fixed;
  top: 50px;
  left: 24px;
  width: 100px;
  font: 20px Arial Bold;
  color: rgb(200, 200, 200);
}
div.Control {
        position: fixed;
        top: 25px;
        left: 24px;
        width: 100px;
        font: 20px Arial Bold;
        color: rgb(200,200,200);
}
div.Scale {
        position: fixed;
        top: 0px;
        left: 24px;
        width: 100px;
        font: 20px Arial Bold;
        padding-right: 30px;
        color: rgb(200,200,200);
}

<div id="Hot" style="visibility: hidden; color:rgb(200,200,200)" class="Hot">Cool: 70.0</div>
<div id="Cold" style="visibility: hidden; color:rgb(200,200,200)" class="Cold">Heat: 64.0</div>
<div ID="Scale" style="color:rgb(200,200,200)" class="Scale">&#8457;</div>
<div ID="Control" style="color:black" class="Control">Cool</div>

Answer 1

您要传递的数组元素是“ Auto”，在switch语句中查找“ Auto”时，请注意空格。您可以更改在原始位置创建消息的方式，也可以检查空白并删除它，或者编辑switch语句以适应它。如果可以选择在消息创建时建议删除空间，并且不会在其他地方创建更多工作。

Answer 2

语法是

"editor.fontFamily": "'IBMPlexMono-Italic', 'Fira Code', sans-serif",

不是

document.getElementById("Hot").style.visibility = "hidden";

为什么这些div无法隐藏和显示？

2 个答案: