隐藏表单内容，直到单击按钮

Question

我想在单击按钮之前隐藏我的表单内容，我使用的代码在单击之前显示内容，我刚开始所以可能缺少一些简单的东西，感谢任何帮助，我正在使用的代码是：

<script>
function myFunction() {
  var x = document.getElementById("myDIV");
  if (x.style.display === "block") {
    x.style.display = "none";
  } else {
    x.style.display = "block";
  }
}
</script>

Answer 1

您必须添加“显示：none；”到 css 文件中的“myDiv”属性然后你可以使用你的 func

Answer 2

试试这个：

function myFunction() {
  var x = document.getElementById("myDIV");
  if (x.style.display == "none" || x.style.display == "") {
    x.style.display = "block";
  } else {
    x.style.display = "none";
  }
}

#myDIV {
 border:solid 1px #c0c0c0;
 padding:10px;
 display:none;
}

<input type="button" onclick="myFunction();" value="switch" /><br>
<div id="myDIV">Welcome</div>

因为，如果 display 在 css 中贴标到 none（或任何但不在 DOM 元素中），那么 javascript 将“看到”它像空字符串。或者，在 <div id="myDIV" style="display:none;"></div> 中设置。在我看来，第一个代码是更好的选择。

Answer 3

我想这就是你需要的代码如下：

document.getElementById("myButton").onclick = function() {
document.getElementById("myInput").style.display = "block";
}

<form>
<input type="text" id="myInput" style="display: none;">
</form>
<button id="myButton">Click</button>

隐藏表单内容，直到单击按钮

Hide form content until button is clicked

javascript

forms

button