slideToggle on multiple items，如果一个打开，则在打开另一个之前关闭该项目

Question

我已经完成了这一点JS，我知道简单的事情，但想知道如果我扩展一个并点击另一个以扩展任何打开的最好的方式将在另一个打开之前关闭。

JS

/* Expand course details */
$('.expandCourse').on('click',function() {
  var courseID = $(this).attr('ID');
  console.log(courseID);
  $("."+courseID).slideToggle();
  return false;
});

HTML示例：

<a href="#" id="link_1" class"expandCourse">test link 1</a>
<div class="link_1" style="display:none;>content here</div>

<a href="#" id="link_2" class"expandCourse">test link 2</a>
<div class="link_2" style="display:none;>content here</div>

<a href="#" id="link_3" class"expandCourse">test link 3</a>
<div class="link_3" style="display:none;>content here</div>

提前致谢！

Answer 1

你可以这样使用

$('.expandCourse').on('click',function() {
   $("[class^=link]").not($(this).next()).slideUp();
   $(this).next().slideToggle();
});

Demo

在每次点击中，它隐藏所有带有类名称的div，以link开头，除了与当前锚点相关的div。

修改

$('.expandCourse').on('click',function() {
   $("[class^=link]").not($("."+this.id)).slideUp();
  $("."+this.id).slideToggle();
});

Updated fiddle