Wil*_*iam 2 html javascript css php
我的代码出了什么问题?当我单击"显示/隐藏"按钮时,没有任何反应.
<html>
<head>
<title>Test</title>
<script type="text/javascript">
function hidecontent(){
document.getElementById("content").style.display = "none;";
}
</script>
<style type="text/css">
#content{
border: 1px solid #003333;
background-color: #000033;
color: #ffffff;
height: 500px;
width: 500px;
text-align: center;
display: block;
}
</style>
</head>
<body>
<form>
<input type="button" value="Hide/Show" onclick="hidecontent()" />
</form>
<?php
echo '<div id="content">Hello world!</div>';
?>
</body>
</html>
Run Code Online (Sandbox Code Playgroud)
问题在这里:
document.getElementById("content").style.display = "none;";
^
------------------------------------|
Run Code Online (Sandbox Code Playgroud)
应该:
document.getElementById("content").style.display = "none";
Run Code Online (Sandbox Code Playgroud)
如果你真的想显示/隐藏div(如按钮value所示),你的函数应如下所示:
function hidecontent(){
var ds = document.getElementById("content");
if (ds.style.display === 'block'){
ds.style.display = 'none';
}
else {
ds.style.display = 'block';
}
}
Run Code Online (Sandbox Code Playgroud)