Question

我有一长串所有具有唯一ID的元素，我希望能够通过点击它们来切换它们。因此，如果元素打开，则类为“plus on”，而其他每个元素都将为“plus”。但是，我无法将先前点击的元素恢复为“加号”。这是我的代码不起作用：

$(".plus").on("click", function () {
    $(".plus").removeClass("on");
});

这部分确实有效，可以打开元素：

        function switch(elem) {
        var elem = document.getElementById(elem);
        elem.className = 'plus on';
        }

我尝试将click功能放在内部，然后在切换功能之前，但我无法正常工作。

Answer 1

对于同一个类的元素之间的简单切换，您可以通过保留当前选定的元素来使用更有效的方法：

var $current = null;

$('.plus').on('click', function() {
    if ($current) {
        $current.removeClass('on');
    }
    $current = $(this).addClass('on');
}

如评论中所述，如果动态添加元素，最好使用事件委托;例如：

$(document).on('click', '.plus', function() {

重要提示：您应该选择一个不会从文档中删除的节点祖先的元素而不是document。

Answer 2

$(".plus").on("click", function () {
    $(this).toggleClass("on");
});

可能是你的意思，通过切换类

来适用于当前点击的元素

Answer 3

试试这个： -

$(".plus").on("click", function () {
    $(".on").each(function(){
        $(this).removeClass("on");
    });
    $(this).addClass("on");
 });

从多个元素中删除类

3 个答案: