JS实现点击时将一个表单从隐藏到显示
时间: 2024-03-13 11:43:25 浏览: 95
js实现点击展开隐藏效果(实例代码)
好的,可以使用JavaScript来实现点击一个按钮时将表单从隐藏到显示。以下是实现的代码:
HTML部分:
```html
<button onclick="toggleForm()">显示表单</button>
<form id="myForm" style="display:none">
<!-- 表单内容 -->
</form>
```
JavaScript部分:
```javascript
function toggleForm() {
var form = document.getElementById("myForm");
if (form.style.display === "none") {
form.style.display = "block";
} else {
form.style.display = "none";
}
}
```
当用户点击按钮时,调用toggleForm函数。该函数通过获取表单元素的引用并检查其当前的display属性来判断表单是否应该显示或隐藏。如果表单当前是隐藏的,则将其display属性设置为"block",使其显示出来;如果表单当前是显示的,则将其display属性设置为"none",使其隐藏起来。
阅读全文