Question

我想要实现的目标...... 如果用户单击第一个列表项，则添加 - background 如果用户AGAIN点击相同的列表项 - 背景应该被删除

没有发生。有人可以看看这个..我也试过toggleClass，但它没有工作..

谢谢！

ageUrl = "";

$('.ageUrl li a').on('click', function(e){
    e.preventDefault();
    ageUrl  = $(this).attr("href");

    if($(this).hasClass('selectedBg')){
        $('.ageUrl li, .ageUrl li a').removeClass('selectedBg');
    }
    else {
        //$(this).addClass('selectedBg');

        $('.ageUrl li, .ageUrl li a').removeClass('selectedBg');
        $(this).closest('li').addClass('selectedBg');
        //$(this).closest('li').toggleClass('selectedBg')
        console.log(ageUrl);
    }
});

$('.crossIconSel').on('click', function(){
    alert('hi');
    $('.ageUrl li, .ageUrl li a').removeClass('selectedBg, crossIconSel');  
});

Answer 1

Demo Fiddle试试这个

 $('.ageUrl li a').on('click', function(e){
            e.preventDefault();
            ageUrl  = $(this).attr("href");

            if($(this).parent('li').hasClass('selectedBg')){
                $('.ageUrl li, .ageUrl li a').removeClass('selectedBg');
            }
            else {
                //$(this).addClass('selectedBg');

                $('.ageUrl li, .ageUrl li a').removeClass('selectedBg');
                $(this).closest('li').addClass('selectedBg');
                //$(this).closest('li').toggleClass('selectedBg')
                console.log(ageUrl);
            }
        });

        $('.crossIconSel').on('click', function(){
            alert('hi');
            $('.ageUrl li, .ageUrl li a').removeClass('selectedBg, crossIconSel');  
        });

Answer 2

您的if条件错误，因为您在a元素上检查了它有SelectedBg个类，而您已在.closest(li)上应用了该类：

只需像这样if条件：

if ($(this).closest('li').hasClass('selectedBg')) {
    $('.ageUrl li, .ageUrl li a').removeClass('selectedBg');
}

Working Demo

Answer 3

看看是否有效

Jquery的

$('.ageUrl li a').on('click', function (e) {
            e.preventDefault();
            $('.ageUrl li a').not(this).removeClass('selectedBg');
            if( $(this).hasClass('selectedBg')){
               $(this).removeClass('selectedBg');
            }
            else{
                $(this).addClass('selectedBg');
            }
        });

工作代码 - ＆gt; JSFIDDLE

替换为jQuery中的Toggle

3 个答案: