根据另一个div的inner.HTML值在div中显示文本

Question

我有以下脚本：

  function showstatus()
  {
  var inputbedtwo = document.getElementById("bedtwostatus");
  var inputliving = document.getElementById("livingstatus");
  var inputkitchen = document.getElementById("kitchenstatus");
  if(inputbedtwo.innerHTML == "A"){
    document.getElementById("statustop").innerHTML = "Danger";
  }
  else if(inputliving.innerHTML == "A"){
    document.getElementById("statustop").innerHTML = "Danger";
  }
  else if(inputkitchen.innerHTML == "A"){
    document.getElementById("statustop").innerHTML = "Danger";
  }
  else{
    document.getElementById("statustop").innerHTML = "Normal";}
  }

麻烦的是，它仅在<span id="statustop"></span>输出普通文本

当状态更改为“ A”时，不会输出危险。

我希望状态为“ A”时输出危险。

谢谢。

Answer 1

我认为您缺少更改事件。

 <input id="bedtwo" type="text" name="" value=""> <span id="statustop"></span> <script type="text/javascript"> var inputbedtwo = document.getElementById("bedtwo"); inputbedtwo.addEventListener("change", function(evt) { if (this.value === "A") { document.getElementById("statustop").innerHTML = "Danger"; } }); </script> 

Answer 2

从标题中，我添加了三个div，其中A，A，B作为其innerHTMl，它工作正常。

现在，如果您可以包括您的标记，这将有助于发现问题，即使不只是看看我在这里所做的事情并自行调整。

 document.getElementById("btn").addEventListener('click',showstatus); function showstatus() { var inputbedtwo = document.getElementById("bedtwostatus"); var inputliving = document.getElementById("livingstatus"); var inputkitchen = document.getElementById("kitchenstatus"); if (inputbedtwo.innerHTML == "A") { document.getElementById("statustop").innerHTML = "Danger"; } else if (inputliving.innerHTML == "A") { document.getElementById("statustop").innerHTML = "Danger"; } else if (inputkitchen.innerHTML == "A") { document.getElementById("statustop").innerHTML = "Danger"; } else { document.getElementById("statustop").innerHTML = "Normal"; } } 

 <div id="bedtwostatus">A</div> <div id="livingstatus">A</div> <div id="kitchenstatus">B</div> <span id="statustop"></span> <button id="btn">SUBMIT</button>