Javascript 引导手风琴范围问题

我在同一页面上有多个引导手风琴，并且注意到任何单个手风琴的事件触发器都会影响所有手风琴（即打开/关闭单个手风琴会影响所有手风琴）

在不更改标记和不使用$（this）的情况下，是否有方法确定以下示例的范围

HTML

当然，请使用手风琴的名称，例如：

*/$('.closeall').click(function(){
    $('.panel-collapse.in')
    .eq(0)  // item at the 0. position
    .collapse('hide');
  });

---

这将只关闭第一项。

实际上，您的JavaScript事件以这两项为目标。面板折叠。您应该只针对.container作用域中的面板，如下所示：

// For close all button
$('.closeall').click(function(){
    $(this).closest('.container').find('.panel-collapse.in').collapse('hide');
});

// For open all button
$('.openall').click(function(){
    $(this).closest('.container').find('.panel-collapse:not(".in")').collapse('show');
});

使用

$（this）

享受。

。你可以很容易地解决这个问题

请使用以下代码

$('.closeall').click(function(){
  $(this).parent().find('.panel-collapse.in').collapse('hide');
});

$('.openall').click(function(){
  $(this).parent().find('.panel-collapse').collapse('show');
});

// For close all button
$('.closeall').click(function(){
    $(this).closest('.container').find('.panel-collapse.in').collapse('hide');
});

// For open all button
$('.openall').click(function(){
    $(this).closest('.container').find('.panel-collapse:not(".in")').collapse('show');
});

$('.closeall').click(function(){
  $(this).parent().find('.panel-collapse.in').collapse('hide');
});

$('.openall').click(function(){
  $(this).parent().find('.panel-collapse').collapse('show');
});