Home/ Questions/Q 9192399
In Process

The Archive Base Latest Questions

Editorial Team
  • 0
Asked: 2026-06-17T20:54:49+00:00

I’m pretty new to JavaScript and I’m having an issue using it to remove

  • 0

I’m pretty new to JavaScript and I’m having an issue using it to remove a CSS property.

Here is what I’m trying to do:

I’m trying to have a text input box invisible when a checkbox is unchecked, and make it visible when the box is checked. Here is the code I have:

<html>
<head>
<script>


if (document.box.test.checked == true)
    {document.getElementById("test").style.display == "";
    }



</script>
<body>

<form name="box"> 
<input type="checkbox" name="test" value="engraved">Engraved?
</form>

<div id="test" style="display:none">
<p>Engraving Message here:</p>
<form>
<input type="text" name="engraving-text" value="Type here">
</form>
</div>



</body>
</html>

Any and all help is greatly appreciated. Thanks everyone!

Share

Leave an answer

You must login to add an answer.

Need An Account,

1 Answer

  1. Editorial Team

    You can use the onchange event on the checkbox 

    <input type="checkbox" name="test" value="engraved" onchange="show_hide()">

    and then toggle the input box 

    function show_hide()
{
    if (document.box.test.checked) {
        document.getElementById("test").style.display = "block";
    } else {
        document.getElementById("test").style.display = "none";
    }
}

    JSFiddle for testing

    • 0