jquery - 单击链接时显示一个 div 并隐藏其他 div

标签 jquery html

我有一个包含 37 个链接和 37 个带有一些文本的隐藏 div 的列表。计数器从 3 开始,以 40 结束。我想做的是在单击链接时显示一个 div,同时隐藏所有其他 div。

链接看起来像这样:

<a href="#" rel="week_3">Week 3</a>
<a href="#" rel="week_4">Week 4</a>

div 看起来像这样:

<div id="week_3" style="display: none">[...]</div>
<div id="week_4" style="display: none">[...]</div>

我想使用 jQuery 执行此任务。我不知道该怎么做的是循环并检查是否单击了这些链接中的任何一个。

最佳答案

类似的东西:

$('a').on('click', function(){
   var target = $(this).attr('rel');
   $("#"+target).show().siblings("div").hide();
});

应该可以解决问题。

P.S:你的 div 必须在一个容器中才能工作。 Fiddle.

关于jquery - 单击链接时显示一个 div 并隐藏其他 div,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/18055524/

相关文章:

Jquery:stop(true) 和clearQueue() 有什么区别

html - 对齐不同的 bootstrap 列

php - 德鲁帕尔 7 : Localhost/user link defaults to website/user

javascript - object.attr ('value' ) 返回属性值而不是属性值

javascript - 在 2D Javascript 数组中搜索值索引

javascript - 如何使用 javascript 将用户 friend 连接的 facebook graph api 响应存储到变量或数组以便稍后使用

javascript - 使用javascript重定向的灯箱

html - Joomla 问题添加 id 选择器

html - 我们可以在 Dreamweaver 中使用 Cufon 吗?

javascript - 将 Owl Carousel 集成到 Wordpress 中