当div折叠时,为什么removeclass不工作?

时间:2014-10-01 10:33:59

标签: javascript jquery html css removeclass

这是我的fiddle

为什么当从另一个div点击div时,当另一个div崩溃时箭头不会显示回来?我已经设置了这样,当div没有上课时点击了#39;然后它删除了班级的箭头'但是当你做到这一点时,它似乎并没有删除箭头'即使div不再拥有“点击”类别。这是我的代码......

$(function timelinetiles() {
   $('.timelineTile').click(function (evt) {
    evt.stopPropagation();
    $('.selected').children().not(this).removeClass('clicked');
    $(this).toggleClass('clicked');

    if ($('.selected').children().hasClass("clicked")) {
        $('.details').addClass('show');
    }

    if ($('.timelineTile').hasClass("clicked")) {
        $(this).children('.arrow').addClass('arrowhide');
    } else {
        $('.arrow').removeClass('arrowhide');
    }


    if ($('.selected').children().hasClass("clicked")) {
        $(this).children('.header').height(430);
    } else {
        $('.header').height(80);
    }


});
});

$(document).click(function () {
$('.timelineTile').removeClass('clicked');
$('.details').removeClass('show');
$('.arrow').removeClass('arrowhide');
});

1 个答案:

答案 0 :(得分:2)

你的第4行还需要删除arrowhide类,如下所示:

$('.selected').children().not(this).removeClass('clicked')
.children('.arrow').removeClass('arrowhide');

更新了小提琴:http://jsfiddle.net/mcx0t0fh/2/

或者,您可以取消箭头业务,并将.arrow.arrowhide CSS规则更改为.clicked .arrow

替代小提琴:http://jsfiddle.net/mcx0t0fh/4/