JavaScript Hide Button

This page discusses - JavaScript Hide Button

JavaScript Hide Button

JavaScript Hide Button

        

In this section, you will learn how to hide the button using JavaScript.

In the given example, we have created a button. The document object grabs the button and refers to property 'visibility' with style object. The 'visibility' property makes the element visible or invisible. Now, if you apply the visibility property with the 'hidden' value to the button, the button will disappear. When you load the page you will get the button. On clicking the button, the function hide() is called,  that makes the button invisible.

Here is the code:

<html>
<h2>Hide Button</h2>
<script>
function hide(){
document.button.butt.style.visibility = 'hidden';
return;
}
</script>
<form name = "button" style="VISIBILITY: visible">
<input type = "button" name="butt" onClick = "hide();" value= "Click Here">
</form>
</html>

Output will be displayed as:

When you click the button, the button gets removed.

Download Source Code: