jQuery toggleClass 不适用于 bootstrap 崩溃（更改 Icon/Class）

Question

我正在使用 bootstrap 3 和折叠功能。如果我点击我的 plus-icon，就会显示折叠面板。再单击一次，面板将关闭。有效！

但是我想toggleClass我的Icon..onclick改成imgMinus（打开折叠），再点击，改成imgPlus（关闭折叠）。

我尝试 addClass 和 removeClass.. 没有任何效果......？

如果我只有一个 Content Container，我的代码片段就可以工作，但不能同时使用两个！

$('.clickToggle').click(function() {
           /*if ($(this).children('div').hasClass("imgPlus")) {
             $(this).children('div').addClass("imgMinus");
             $(this).children('div').removeClass("imgPlus");
          }*/

          $(this).children('div').toggleClass('imgPlus imgMinus');
});

Answer 1

你很接近！我从您的 html 中删除了脚本标签，并将其放在 fiddle 的 JavaScript 部分。然后我删除了点击切换的额外脚本。

这么说有点令人困惑 fiddle 让我知道这是否解决了问题！下面的代码是唯一需要将 + 更改为 - 的脚本，反之亦然 http://jsfiddle.net/02o08heq/31/

$( document ).ready(function() {
    $('.clickToggle').click(function() {
        $(this).children('div').toggleClass('imgPlus imgMinus');
    });
});

另外，在您的 fiddle 中，当我相信您指的是 toggleClass 时，您有 addClass（即使您的代码片段有它）

Answer 2

之前添加：

<script>
    $(document).ready(function() {
        $('.clickToggle').click(function() {
            $(this).find('div').toggleClass("imgMinus");
            $(this).find('div').toggleClass("imgPlus");
        });
    });
</script>

这样就可以了！

jQuery toggleClass 不适用于 bootstrap 崩溃（更改 Icon/Class）

jQuery toggleClass not working with bootstrap collapse (change Icon/Class)

jquery

addclass

collapse

removeclass

toggleclass