怎样用jquery控制div的显示与隐藏
<divid="tab"><input/></div><divid="tab"><input/></div><divid="tab"><input/></div>就是有三...
<div id="tab"><input/></div>
<div id="tab"><input/></div>
<div id="tab"><input/></div>
就是有三个div 里面都有一个按钮 怎样实现点击第一个div的按钮出现第二个div 隐藏第一个和第三个 点击第二个div的按钮出现第三个div 隐藏第一个和第二个div 展开
<div id="tab"><input/></div>
<div id="tab"><input/></div>
就是有三个div 里面都有一个按钮 怎样实现点击第一个div的按钮出现第二个div 隐藏第一个和第三个 点击第二个div的按钮出现第三个div 隐藏第一个和第二个div 展开
3个回答
展开全部
var divs=$(".tab");
divs.each(function(i){
var $this=$(this);
$this.children("input").click(function(){
if(i==0)
{
divs.eq(0).hide();
divs.eq(2).hide();
divs.eq(1).show();
}
else if(i==1){
divs.eq(0).hide();
divs.eq(1).hide();
divs.eq(2).show();
}
else .....//依此类推
}
});
});
大概是这样,至于如何优化,就看你的了。。
推荐于2016-05-31
展开全部
<!DOCTYPE HTML>
<html lang="en-US">
<head>
<meta charset="UTF-8">
<meta name="keywords" content="白菜编辑部">
<title>白菜编辑部</title>
<style type="text/css">
</style>
<script type="text/javascript" src="jquery-1.8.0.min.js"></script>
<script type="text/javascript">
$ (function ()
{
$ ('div#tab :button').click (function ()
{
$(this).closest('div#tab').next('div').show().siblings('div').hide();
})
})
</script>
</head>
<body>
<div id="tab">
<input type="button" value="test1" />
</div>
<div id="tab">
<input type="button" value="test2" />
</div>
<div id="tab">
<input type="button" value="test3" />
</div>
</body>
</html>
<html lang="en-US">
<head>
<meta charset="UTF-8">
<meta name="keywords" content="白菜编辑部">
<title>白菜编辑部</title>
<style type="text/css">
</style>
<script type="text/javascript" src="jquery-1.8.0.min.js"></script>
<script type="text/javascript">
$ (function ()
{
$ ('div#tab :button').click (function ()
{
$(this).closest('div#tab').next('div').show().siblings('div').hide();
})
})
</script>
</head>
<body>
<div id="tab">
<input type="button" value="test1" />
</div>
<div id="tab">
<input type="button" value="test2" />
</div>
<div id="tab">
<input type="button" value="test3" />
</div>
</body>
</html>
追问
没用昂
追答
这个是例子,你看下,有没有效果
本回答被提问者采纳
已赞过
已踩过<
评论
收起
你对这个回答的评价是?
展开全部
$('.production_column ul li').click(function(){
$(this).removeClass('check_on').addClass('check_on').siblings().removeClass('check_on');
});
你不能用id,用class可以
id 属性只能在每个 HTML 文档中出现一次
$(this).removeClass('check_on').addClass('check_on').siblings().removeClass('check_on');
});
你不能用id,用class可以
id 属性只能在每个 HTML 文档中出现一次
已赞过
已踩过<
评论
收起
你对这个回答的评价是?
推荐律师服务:
若未解决您的问题,请您详细描述您的问题,通过百度律临进行免费专业咨询