javascript 在页面加载时隐藏按钮
声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow
原文地址: http://stackoverflow.com/questions/12081061/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
Making button hidden on page load
提问by John Doe
Without using jQuery, I want my button with the text "Process"
to not be visible (in all browsers) when the visitor comes to the page. And when they select a value from the drop down other than the first entry (blank)
one or Have a Baby
for it to make the button visible.
在不使用 jQuery 的情况下,我希望我的带有文本的按钮"Process"
在访问者访问页面时不可见(在所有浏览器中)。当他们从下拉列表中选择一个值而不是一个值时,first entry (blank)
或者Have a Baby
它使按钮可见。
<html>
<head>
<title>Life Event Picker Calendar</title>
<script>
// Function being used to hide/unhide the button
function changeMessage(oElement) {
if (oElement.value == "100") {
document.getElementById("btn").style.visibility = "hidden";
} else if (oElement.value == "0") {
document.getElementById("btn").style.visibility = "hidden";
} else {
document.getElementById("btn").style.visiblity = "visible";
}
}
</script>
</head>
<body>
...
...
<!-- Based on the selection here - the button below would be made visible -->
<select id="leave" onchange="changeMessage(this);">
<option value="0"></option>
<option value="5">Get Married</option>
<option value="100">Have a Baby</option>
<option value="90">Adopt a Child</option>
<option value="15">Retire</option>
<option value="15">Military Leave</option>
<option value="15">Medical Leave</option>
</select>
<!-- The button in question -->
<button id="btn" onclick="getInfo()"type="button">Process</button>
...
...
</body>
</html>
回答by Grampa
Try adding the style="visibility:hidden;"
attribute to the button. Also, consider using display:none
and display:inline-block
instead of visibility
.
尝试将style="visibility:hidden;"
属性添加到按钮。另外,请考虑使用display:none
anddisplay:inline-block
而不是visibility
。