使用CSS隐藏窗体。但是,我想在点击应用按钮后显示它。我还尝试了document.getElementById(“ApplicationForm”)。style.visibility:“visible”;
,但也不工作。
null
function myFunction() {
document.getElementById("applicationform").style.display = "block";
}
#applicationform {
display: none;
}
<button onclick="myFunction()">Apply</button>
<div id="applicationform">
<form>
<input type="text" placeholder="Enter Name">
<input type="email" placeholder="Email">
<input type="password" placeholder="Password">
<input type="Submit" value="SUBMIT">
</form>
</div>
null
发生这种情况是因为按钮导致回发,
添加“返回False;”函数之后,以禁用单击按钮后的回发:
<button onclick="myFunction();return false">Apply</button>
完整代码:
null
<html>
<head>
<style>
#applicationform {
display: none;
}
</style>
<script>
function myFunction() {
document.getElementById("applicationform").style.display = "block";
}
</script>
</head>
<body>
<button onclick="myFunction(); return false">Apply</button>
<div id="applicationform">
<form>
<input type="text" placeholder="Enter Name">
<input type="email" placeholder="Email">
<input type="password" placeholder="Password">
<input type="Submit" value="SUBMIT">
</form>
</div>
</body>
</html>