Jquery 单击链接时在另一个上显示div

我想在单击链接时在另一个div上显示一个div 以下是html和css代码：

<div id="desc" class="desc">some text</div>
<div id="awards" class="awards">some other text</div>
<a href="#">click</a>

.desc {
border:1px solid #000;
height:170px;
width:330px;
}
.awards {
border:1px solid #000;
height:170px;
width:330px;
display:none;
}

一些文本
其他一些文本
.描述{
边框：1px实心#000；
高度：170px；
宽度：330px；
}
.奖项{
边框：1px实心#000；
高度：170px；
宽度：330px；
显示：无；
}

如果可能的话，我会用过渡

我举了一个例子，我想让desc消失并奖励apear

---

在最简单的jQuery中-

$('a').click(function(){
  $('#desc').fadeOut();
  $('#awards').fadeIn();
});

有关使用Javascript的完整文档，请参见和

函数fun（）
{
document.getElementById（“desc”）.style.display=“无”；
document.getElementById（“awards”）.style.display=“block”；
}

.desc{
边框：1px实心#000；
高度：170px；
宽度：330px；
}
.奖项{
边框：1px实心#000；
高度：170px；
宽度：330px；
显示：无；
}

一些文本
其他一些文本

试试这个：

---

如果您不想回到初始状态，那么就不需要Javascript：只需将CSS与

：target

伪类一起使用即可

例如：

---

标记：

<div id="desc" class="desc">some text</div>
<div id="awards" class="awards">some other text</div>
<a href="#desc">click</a>

如果您还需要转换，您可以使用

不透明度

属性，例如使用切换功能

$('a').click(function(){
    $('#desc').toggle();
  $('#awards').toggle();
});

---

尽量只发布与您的问题相关的代码，这将使更多的人阅读该问题，从而更容易帮助您。在你的问题中还包括你已经试图解决的问题，这鼓励人们提供帮助，因为他们觉得你不想让他们为你工作（而且他们有开始的地方）。

div:target {
    display: none;
}

div:target + div  {
    display: block;
}

$('a').click(function(){
    $('#desc').toggle();
  $('#awards').toggle();
});