html显示隐藏FROM表单

一入程序无退路

于 2024-11-25 17:11:23 发布

阅读量440

点赞数 5

文章标签：前端 javascript html

本文链接：https://blog.youkuaiyun.com/lgq1368853532/article/details/144032354

版权

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Form Visibility Example</title>
<script>
function toggleForm() {
    var form = document.getElementById("myForm");
    if (form.style.display === "none") {
        form.style.display = "block";
    } else {
        form.style.display = "none";
    }
}
</script>
</head>
<body>
 
<button onclick="toggleForm()">显示/隐藏表单</button>
 
<form id="myForm">
    <input type="text" name="username" placeholder="用户名">
    <input type="password" name="password" placeholder="密码">
    <input type="submit" value="提交">
</form>
 
</body>
</html>