使用Javascript更改CSS Visibility属性_Javascript

使用Javascript更改CSS Visibility属性

javascript

使用Javascript更改CSS Visibility属性,javascript,Javascript,我对JavaScript非常陌生，在使用它删除CSS属性时遇到了一个问题以下是我想做的：我试图在复选框未选中时使文本输入框不可见，并在复选框选中时使其可见。以下是我的代码： <html> <head> <script> if (document.box.test.checked == true) {document.getElementById("test").style.display == ""; } </script&

我对JavaScript非常陌生，在使用它删除CSS属性时遇到了一个问题

以下是我想做的：

我试图在复选框未选中时使文本输入框不可见，并在复选框选中时使其可见。以下是我的代码：

<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>


if（document.box.test.checked==true）
{document.getElementById（“test”）.style.display==“”；
}
雕刻？
在此处雕刻信息：

非常感谢您的任何帮助。谢谢大家

您可以使用

复选框上的onchange
事件
<input type="checkbox" name="test" value="engraved" onchange="show_hide()">

对于测试，这里有两个问题
您编写的脚本将显示更改为“”仍将显示
文本框应该是display=“none”

脚本不会在每次人员更改复选框的值时运行
试试这个。
将您的检查封装到一个函数中，然后将该函数添加到body onload事件和复选框的onchage事件中
<script>

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

</script>
<body onload="checkHideTextField()">

<form name="box"> 
<input onchage="checkHideTextField()" 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>


函数checkHideTextField（）
{
if（document.box.test.checked==true）
{
document.getElementById（“test”）.style.display==“无”；
}
}
雕刻？
在此处雕刻信息：
请注意，和之间存在差异。
<script>

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

</script>
<body onload="checkHideTextField()">

<form name="box"> 
<input onchage="checkHideTextField()" 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>