Html中checkbox点击显示隐藏层,再点击层再次隐藏,这样的效果怎么写?
<!DOCTYPEhtmlPUBLIC"-//W3C//DTDXHTML1.0Transitional//EN""http://www.w3.org/TR/xhtml1/...
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<title>无标题文档</title>
<style type="text/css">
#chk{ margin-top:100px; margin-left:50px;}
.div_hidden{ margin-left:65px; width:230px; height:100px; margin-top:5px; background:#99CC99; border:1px solid #666666; color:#996600; display:none;}
p{ font-size:13px;}
</style>
</head>
<script type="text/javascript">
function getBlock(ck,d)
{
var c = document.getElementById(ck);
var d = document.getElementById(d);
d.style.display = "block";
}
</script>
<!--其实这个函数没什么用,要控制层的显示和隐藏,能用到它吗?-->
<body>
<input type="checkbox" id="chk" onclick="getBlock('chk','div_hidden')"/>显示
<div class="div_hidden" id="div_hidden">
<p>帮帮忙吧</p>
<p>其实很简单,但我不会啊,没办法……</p>
<p>我会非常感谢的。</p>
</div>
</body>
</html>
这个是我写的部分,只能显示,不会隐藏的…… 要最简单代码。
Thanks……!
哎呀 真的是笨到家了 一时糊涂 写成了(c.checked = "checked"),要哭了啊 !……
不过谢谢各位了 都给分吧
不过事件是onclick就行了 展开
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<title>无标题文档</title>
<style type="text/css">
#chk{ margin-top:100px; margin-left:50px;}
.div_hidden{ margin-left:65px; width:230px; height:100px; margin-top:5px; background:#99CC99; border:1px solid #666666; color:#996600; display:none;}
p{ font-size:13px;}
</style>
</head>
<script type="text/javascript">
function getBlock(ck,d)
{
var c = document.getElementById(ck);
var d = document.getElementById(d);
d.style.display = "block";
}
</script>
<!--其实这个函数没什么用,要控制层的显示和隐藏,能用到它吗?-->
<body>
<input type="checkbox" id="chk" onclick="getBlock('chk','div_hidden')"/>显示
<div class="div_hidden" id="div_hidden">
<p>帮帮忙吧</p>
<p>其实很简单,但我不会啊,没办法……</p>
<p>我会非常感谢的。</p>
</div>
</body>
</html>
这个是我写的部分,只能显示,不会隐藏的…… 要最简单代码。
Thanks……!
哎呀 真的是笨到家了 一时糊涂 写成了(c.checked = "checked"),要哭了啊 !……
不过谢谢各位了 都给分吧
不过事件是onclick就行了 展开
3个回答
展开全部
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<title>无标题文档</title>
<style type="text/css">
#chk{ margin-top:100px; margin-left:50px;}
.div_hidden{ margin-left:65px; width:230px; height:100px; margin-top:5px; background:#99CC99; border:1px solid #666666; color:#996600; display:none;}
p{ font-size:13px;}
</style>
</head>
<script type="text/javascript">
function getBlock(ck,d)
{
var c = document.getElementById(ck);
var d = document.getElementById(d);
if(c.checked==true){
d.style.display = "block";
}
else{
d.style.display = "none";
}
}
</script>
<!--其实这个函数没什么用,要控制层的显示和隐藏,能用到它吗?-->
<body>
<input type="checkbox" id="chk" onclick="getBlock('chk','div_hidden')"/>显示
<div class="div_hidden" id="div_hidden">
<p>帮帮忙吧</p>
<p>其实很简单,但我不会啊,没办法……</p>
<p>我会非常感谢的。</p>
</div>
</body>
</html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<title>无标题文档</title>
<style type="text/css">
#chk{ margin-top:100px; margin-left:50px;}
.div_hidden{ margin-left:65px; width:230px; height:100px; margin-top:5px; background:#99CC99; border:1px solid #666666; color:#996600; display:none;}
p{ font-size:13px;}
</style>
</head>
<script type="text/javascript">
function getBlock(ck,d)
{
var c = document.getElementById(ck);
var d = document.getElementById(d);
if(c.checked==true){
d.style.display = "block";
}
else{
d.style.display = "none";
}
}
</script>
<!--其实这个函数没什么用,要控制层的显示和隐藏,能用到它吗?-->
<body>
<input type="checkbox" id="chk" onclick="getBlock('chk','div_hidden')"/>显示
<div class="div_hidden" id="div_hidden">
<p>帮帮忙吧</p>
<p>其实很简单,但我不会啊,没办法……</p>
<p>我会非常感谢的。</p>
</div>
</body>
</html>
展开全部
function getBlock(ck,d)
{
//var c=document.getElementById(ck);
var d = document.getElementById(d);
if(d.style.display=="none")
{
d.style.display = "block";
}
else
{
d.style.display = "none";
}
}
或者
function getBlock(ck,d)
{
var c=document.getElementById(ck);
//var d=document.getElementById(d);
if(c.checked=true)
{
d.style.display = "block";
}
else
{
d.style.display = "none";
}
}
{
//var c=document.getElementById(ck);
var d = document.getElementById(d);
if(d.style.display=="none")
{
d.style.display = "block";
}
else
{
d.style.display = "none";
}
}
或者
function getBlock(ck,d)
{
var c=document.getElementById(ck);
//var d=document.getElementById(d);
if(c.checked=true)
{
d.style.display = "block";
}
else
{
d.style.display = "none";
}
}
已赞过
已踩过<
评论
收起
你对这个回答的评价是?
展开全部
在getBlock里边判断
if(c.checked)
{
d.style.display="block";
}
else
{
d.style.display="none";
}
if(c.checked)
{
d.style.display="block";
}
else
{
d.style.display="none";
}
已赞过
已踩过<
评论
收起
你对这个回答的评价是?
推荐律师服务:
若未解决您的问题,请您详细描述您的问题,通过百度律临进行免费专业咨询