根據另一個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>