删除和添加css类onclick

Question

我在配置如何在onclick事件中更改div内的跨度的css类时遇到一些麻烦。

的javascript：

$(document).on('click', '.list_accordion_toggle', function (event) {
            $(this).toggleClass('list_item collapse').next().toggle();
        });

视图：

<div class="list_accordion_toggle" id="letter">
        <span data-bind=" text: Letter"></span>
        <span class="icon-minus-sign"></span>
    </div>

当用户点击div时，icon-minus-sign应替换为icon-plus-sign，并且每次点击都会继续切换。

我使用toggleClass或removeClass然后使用addClass？

Answer 1

尝试

$(document).on('click', '.list_accordion_toggle', function (event) {
    $(this).toggleClass('list_item collapse').next().toggle();
    $(this).find('.icon-minus-sign, .icon-plus-sign').toggleClass('icon-minus-sign icon-plus-sign')
});

演示：Fiddle

Answer 2

试试这个

    iCount=0;
    $(document).on('click', '.list_accordion_toggle', function (event) {
        if(iCount==0){
        $(this).addClass(icon-minus-sign);
        $(this).removeClass(icon-plus-sign);
        iCount=1;
    }
    else{
        $(this).addClass(icon-plus-sign);
        $(this).removeClass(icon-minus-sign);
        }
    });