кнопку Сделать видимым Js переменной

Question

Можно ли сделать кнопку в HTML видимой, если переменная в JavaScript, верно

экс-код: var systemON = true;

И если SystemOn верно, я хочу кнопку, чтобы быть видимый в html.

Answer 1

ну да ..

if (sistemON) { 
    document.getElementById("yourButtonID").style.display = "block"; 
} 

Теперь я не уверен, если это то, что вы хотите, или вы можете переключать видимость каждый т ime переменные изменения в вашем коде?

Answer 2

if (systemON) { 
    document.getElementById("button").style.display = "none"; 
} else { 
    document.getElementById("button").style.display = "block"; 
} 

должен делать это

Answer 3

Я предпочитаю использовать трехкомпонентную boolean?when_true:when_false; которая стенография для

if (boolean) { 
    when_true; 
} 
else { 
    when_false; 
} 

Тогда в предположении о выполнении после нажатия кнопки доступна в DOM, вы можете установить дисплей например:

document.getElementById("buttonID").style.display=systemON?"‌​":"none"; // or "block":"none" 

используя CSS

#buttonID { display:none } 

---

Если вы хотите кнопку еще занимают место на странице, используйте

document.getElementById("buttonID").style.visibility=systemON?"‌​visible":"hidden"; 

с помощью CSS

#buttonID { visibility:hidden } 

Answer 4

Попробуйте это: https://jsfiddle.net/820dzf3j/

var systemON = false; 
var button = document.getElementById("myButton"); 
if(systemON) { 
button.style.visibility = "hidden"; 
} 

Answer 5

Здесь у вас есть пример кода, который делает то, что вы спрашиваете:

FIDDLE

var systemON = true; 
 

 
if (systemON) { 
 
    document.getElementById("elementToShow").className = "showClass"; 
 
} else { 
 
    document.getElementById("elementToShow").className = "hideClass"; 
 
}

.showClass { 
 
    display: block; 
 
} 
 
.hideClass { 
 
    display: none; 
 
}

<div id="elementToShow" class="hideClass"> 
 
    Show me! 
 
</div>

Answer 6

var systemON = false; 
 

 
// checks if it is true 
 
if (systemON) { 
 
    document.getElementById("button1").style.display = "block"; 
 
} 
 
// checks if it is false 
 
else { 
 
    document.getElementById("button1").style.display = "none"; 
 
} 
 

 
var systemOFF = true; 
 

 
// checks if it is true 
 
if (systemOFF) { 
 
    document.getElementById("button2").style.display = "block"; 
 
} 
 
// checks if it is false 
 
else { 
 
    document.getElementById("button2").style.display = "none"; 
 
}

<button id="button1">Hidden</button> 
 
<button id="button2">Displayed</button>

Answer 7

Я использую этот код, чтобы сделать кнопку видимой и скрытой, когда это необходимо

HTML:

<div class="system" id="SystemButton"> 
    <p>System Runtime <span id="runtime"></span></p> 
    <p>System Failures: <span id="failures"></span></p> 
    <p><button id="Shutdown" onclick="systemDown(1)">Shutdown System</button></p> 
</div> 

JS:

var systemON = true; 
if(systemON == true){ 
    document.getElementById('systemButton').style.display = "block"; 
}else{ 
    document.getElementById('systemButton').style.display = "none"; 
    }