html 点击一个按钮 显示另一个div 隐藏之前呢个div
就是我用VS做的web,我想实现点击一个按钮,它就会显示出来,而点击另一个按钮,之前那个就会隐藏,现在这个的内容就会显示出来。按钮有多个,需要案例...
就是我用VS做的web,我想实现点击一个按钮,它就会显示出来,而点击另一个按钮,之前那个就会隐藏,现在这个的内容就会显示出来。按钮有多个,需要案例
展开
2个回答
展开全部
<html>
<head>
<meta charset="utf-8"/>
<style>
div{display:none;}
</style>
<script src="jquery.js"></script>
<script>
$(function(){
$("button").click(function(){
var index = $(this).index();
$(".d").hide();
$(".d:eq("+index+")").show();
});
});
</script>
</head>
<body>
<button>1111</button>
<button>2222</button>
<button>3333</button>
<button>4444</button>
<button>5555</button>
<button>6666</button>
<div class="d">我是第1个</div>
<div class="d">我是第2个</div>
<div class="d">我是第3个</div>
<div class="d">我是第4个</div>
<div class="d">我是第5个</div>
<div class="d">我是第6个</div>
</body>
</html>
自行引入jquery文件
<head>
<meta charset="utf-8"/>
<style>
div{display:none;}
</style>
<script src="jquery.js"></script>
<script>
$(function(){
$("button").click(function(){
var index = $(this).index();
$(".d").hide();
$(".d:eq("+index+")").show();
});
});
</script>
</head>
<body>
<button>1111</button>
<button>2222</button>
<button>3333</button>
<button>4444</button>
<button>5555</button>
<button>6666</button>
<div class="d">我是第1个</div>
<div class="d">我是第2个</div>
<div class="d">我是第3个</div>
<div class="d">我是第4个</div>
<div class="d">我是第5个</div>
<div class="d">我是第6个</div>
</body>
</html>
自行引入jquery文件
更多追问追答
追问
我用的是C#的asp。net web,可以详细解释一下怎么做吗?我就一个新新手
追答
首先暂时不管你是哪个领域的哈,单看js和html,你的需求是点一个按钮弹出一个弹出层(div),那么你的按钮可以定义同一个class(比如class="btn"),同理,你的弹出层也是一样(比如class="div"),他们是存在着对应关系的,即第一个按钮对应着第一个div...以此类推,所以他们的下标是一样的,那么写代码的思路就是,先获取点击的按钮的下标,然后把所有弹出层都hide(),再把对应的div(jquery提供的选择器中,:eq(0)这里面的0就是下标,写上下标就找到该元素了)show()出来,功能就实现了。
本回答被提问者和网友采纳
已赞过
已踩过<
评论
收起
你对这个回答的评价是?
2016-07-26 · 百度知道合伙人官方认证企业
育知同创教育
1【专注:Python+人工智能|Java大数据|HTML5培训】 2【免费提供名师直播课堂、公开课及视频教程】 3【地址:北京市昌平区三旗百汇物美大卖场2层,微信公众号:yuzhitc】
向TA提问
关注
展开全部
用.hide();来隐藏
用.show();做显示就可以了。
用.show();做显示就可以了。
追问
可以给一个详细的案例吗?
已赞过
已踩过<
评论
收起
你对这个回答的评价是?
推荐律师服务:
若未解决您的问题,请您详细描述您的问题,通过百度律临进行免费专业咨询