html, javascript, if 语句为真时显示按钮。如果不正确则隐藏按钮

Question

我想知道如果变量是特定值，我如何显示按钮。例如：如果变量为 5，则显示按钮，但如果变量不是 5，则隐藏按钮。这是我在 div:

中的两个按钮

 <div style="z-index: 999; position: fixed">
        <button id="speedbtn">Change speed</button>
        <button id="jmpbtn">Change jump power</button>
      </div>

如果变量设置为 5，我想显示这些按钮。如果变量不是 5，隐藏按钮。

Answer 1

使用 if 语句检查变量值，然后更新按钮的显示样式。

var example = 6;

if(example === 5) {
  document.getElementById("speedbtn").style.display = "none";
  document.getElementById("jmpbtn").style.display = "none";
} else {
  document.getElementById("speedbtn").style.display = "";
  document.getElementById("jmpbtn").style.display = "";
}

<div style="z-index: 999; position: fixed">
  <button id="speedbtn">Change speed</button>
  <button id="jmpbtn">Change jump power</button>
</div>

Answer 2

var your_default_var = 5;
check(your_default_var);
function set(num){
 var yes_no = num;
 check(yes_no);
}
function check(your_var){
 if(your_var == 5){
document.getElementById("speedbtn").style.display = "block";
document.getElementById("jmpbtn").style.display = "block";
}else if(your_var > 5||your_var < 5){
 document.getElementById("speedbtn").style.display = "none";
 document.getElementById("jmpbtn").style.display = "none";
  }
}

<div style="z-index: 999; position: fixed">
        <button id="speedbtn">Change speed</button>
        <button id="jmpbtn">Change jump power</button>
      <button onclick="set(6);">Set var to 6</button>
<button onclick="set(5);">Set var to 5</button>
<button onclick="set(4);">Set var to 4</button>
      </div>

试试这个！

html, javascript, if 语句为真时显示按钮。如果不正确则隐藏按钮

html, javascript, Display button when if statement is true. Hide button if not true

html

javascript

css

button