jQuery使li处于活动状态显示div内容

我有ul导航。我需要在单击“资源”li时显示div内容，并激活“资源”li。然后，当单击div内容关闭时，隐藏div内容并使li处于非活动状态。我不知道该怎么做，所以任何见解都会有所帮助

单击此li项目，使其处于活动状态：

<li><a href="">Resources</a></li>

显示此div内容

<div id="pdftab">Some content</div>

一些内容

---

非常感谢

不知道您的页面标记，我可以给您一个提示。像这样的东西对你会有用的

$('li a').click(function(){
   $('#pdftab').show();
   $(this).parent().addClass('active');
   return false;
});

$('#pdftab').click(function(){
   $(this).hide();
   $('li').removeClass('active');
});

定义活动类样式

.active{
   //add required styles
}

您可以使用

addClass

/

removeClass

从dom元素中添加/删除类。对jQuery对象调用

.parent（）

，将获得父元素

更新：

基于来自的标记

$('#navlist li:eq(1) a').click(function(){
   $('#pdftab').show()
               .animate({left: '+=340px'}, 1200);
   $(this).parent().addClass('resourceactive');
   return false;
});

$('#pdftab').click(function(){
   $(this).hide();
   $('#navlist li:eq(1)').removeClass('resourceactive');
});

---

li

是否有

id

？

li

元素与div的顺序之间是否存在任何关系？你能提供一份显示你（代表）的更大部分的报价吗？li没有id。在这个特定页面上只有2个li。一个连接到外部链接。“资源”li将是唯一显示div内容的li。如果在内容不在时单击“资源”，则内容将继续动画。当你点击“资源”时，是否有一个停止动画的功能？这是因为你每次点击它时都在制作动画。替换此行

$（'#pdftab'）。动画（{左：'+=843px'}，1200）由
$（'#pdftab'）.css（'left'，'0px'）.animate（{left:'+=843px'}，1200）在您的代码中。