希望这是一个简单的问题。我有一个div
,我想用按钮将其隐藏/显示
<div id="newpost">
发布于 2010-12-25 03:55:16
下面是一种简单的切换Javascript方式:
<script>
var toggle = function() {
var mydiv = document.getElementById('newpost');
if (mydiv.style.display === 'block' || mydiv.style.display === '')
mydiv.style.display = 'none';
else
mydiv.style.display = 'block'
}
</script>
<div id="newpost">asdf</div>
<input type="button" value="btn" onclick="toggle();">
发布于 2019-04-25 03:46:11
尝试使用不透明度
div { transition: all 0.4s ease }
.hide { opacity: 0; }
<input onclick="newpost.classList.toggle('hide')" type="button" value="toggle">
<div id="newpost">Hello</div>
发布于 2015-01-09 02:44:44
这就是我使用类隐藏和显示内容的方式。将类更改为nothing将显示更改为block,将类更改为'a‘将显示为none。
<!DOCTYPE html>
<html>
<head>
<style>
body {
background-color:#777777;
}
block1{
display:block; background-color:black; color:white; padding:20px; margin:20px;
}
block1.a{
display:none; background-color:black; color:white; padding:20px; margin:20px;
}
</style>
</head>
<body>
<button onclick="document.getElementById('ID').setAttribute('class', '');">Open</button>
<button onclick="document.getElementById('ID').setAttribute('class', 'a');">Close</button>
<block1 id="ID" class="a">
<p>Testing</p>
</block1>
</body>
</html>
https://stackoverflow.com/questions/4528085
复制相似问题