手风琴Sharepoint 2010内容查询

我现在正在尝试为内容查询webpart实现accordion函数。

基本上，内容查询结构如下所示：标题内容我想展开崩溃

 
 Title 
 
 Content I want to expand collapse 
 
 
 
 Title 
 
 Content I want to expand collapse 
 
 
 
 Title 
 
 Content I want to expand collapse 
  

我有3-5个。

我现在要做的是每当我点击相应的链接项（标题）div时展开描述div。

这是我的JS代码：

 $(document).ready(function () { //ACCORDION BUTTON ACTION $('#MSOZoneCell_WebPartWPQ3 .link-item').click(function () { //MAKE THE ACCORDION CLOSE ON THE SECOND CLICK if ($('#MSOZoneCell_WebPartWPQ3 .description').hasClass('openDiv')) { $('#MSOZoneCell_WebPartWPQ3 .description').toggle('normal'); $(this).next().removeClass('openDiv'); } else { $('#MSOZoneCell_WebPartWPQ3 .description').toggle('normal'); $(this).next().toggle('normal'); $(this).next().addClass('openDiv'); } }); //HIDE THE DIVS ON PAGE LOAD $("#MSOZoneCell_WebPartWPQ3 .description").hide(); }); 

我现在遇到的问题是，每当我点击任何一个标题时，所有描述div都会扩展，这不是我想要的，因为我只想在我点击的标题下展开的特定描述。

这里的任何帮助将非常感谢！ 谢谢！！

Answer 1

检查这些，我认为其中一个应该是你想要的。 在添加/删除类时，您是正确的，您只需要为切换执行此操作：

http://jsfiddle.net/7dcj4/

 $(document).ready(function () { //ACCORDION BUTTON ACTION $('#MSOZoneCell_WebPartWPQ3 .link-item').click(function () { //MAKE THE ACCORDION CLOSE ON THE SECOND CLICK var $content = $(this).siblings('.description'); var visible = $content.is(':visible'); $("#MSOZoneCell_WebPartWPQ3 .description:visible").toggle('normal'); if (!visible) $content.toggle('normal'); }); //HIDE THE DIVS ON PAGE LOAD $("#MSOZoneCell_WebPartWPQ3 .description").hide(); }); 

http://jsfiddle.net/uBnrV/

 $(document).ready(function () { //ACCORDION BUTTON ACTION $('#MSOZoneCell_WebPartWPQ3 .link-item').click(function () { //MAKE THE ACCORDION CLOSE ON THE SECOND CLICK $(this).siblings('.description').toggle('normal'); }); //HIDE THE DIVS ON PAGE LOAD $("#MSOZoneCell_WebPartWPQ3 .description").hide(); });