在这段代码中，我有两个元素；一个 ID 为“alpha”的输入框和一个 ID 为“bravo”的段落。我要做的是在输入框 alpha 中没有任何内容时让 bravo 不可见。
这是我目前所拥有的:
<html>
<head>
<script>
var a = document.getElementById("alpha");
var b = document.getElementById("bravo");
window.onload = function hidebravo() {
if (a.value == nil) {b.style.visibility = "hidden";}
}
a.onchange = function hidebravo() {
if (a.value == nil) {b.style.visibility = "hidden";}
}
</script>
</head>
<body>
<input id="alpha"/>
<p id="bravo">Hello!</p>
</body>
</html>
为了清楚起见，我设置了变量 'a' 和 'b' 分别对应于输入框和段落的 JS 选择器。
现在，一旦加载窗口，我就会调用函数“hidebravo()”，该函数可以使 bravo 不可见如果 输入框 alpha 为空。每当用户更改 alpha 的值时，我都会调用相同的函数，以防 alpha 包含一个值，然后用户将其删除并再次变为空。
但是，无论出于何种原因，这并没有正常工作，我也不知道为什么。
请帮忙!
最佳答案
您应该在 Javascript 中使用 null 而不是 nil。
这是没有 window.onload 函数的有效代码:
JS:
function reloadBravo() {
var bravoParagraph = document.getElementById('bravo');
var alphaTextBox = document.getElementById('alpha');
var alphaText = alphaTextBox.value;
if (alphaText.length > 0) {
bravoParagraph.innerHTML = alphaText;
bravoParagraph.style.visibility = 'visible';
} else {
bravoParagraph.innerHTML = '';
bravoParagraph.style.visibility = 'hidden';
}
}
HTML:
<html>
<head>
</head>
<body>
<input id="alpha" onkeyup="reloadBravo()"/>
<p id="bravo"></p>
</body>
</html>
关于javascript - 使用 javascript 条件隐藏元素，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/38174684/