从所有其他列表项中删除类

Question

我在这方面得到了其他人的帮助，但他们的回答有点过于宽泛，无法帮助我......我是 javascript 的新手，所以我无法完全理解他们的答案（我在过去 3 天里尝试过的所有东西都没有奏效。）工作站点在这里：http://www.studioimbrue.com/beta 问题是缩略图，一旦单击它们，它会正确添加 .selected 类，但是当单击另一个时，它无法从任何其他缩略图中删除 .selected 类。如果您能更正我的代码，那就太棒了，如果您想解释我的错误之处，请继续！

$(document).ready(function(){ 
    var activeOpacity   = 1.0,
        inactiveOpacity = 0.6,
        fadeTime = 100,
        clickedClass = "selected",
        thumbs = "#list li";

    $(thumbs).fadeTo(1, inactiveOpacity);

    $(thumbs).hover(
        function(){
            $(this).fadeTo(fadeTime, activeOpacity);
        },
        function(){
            // Only fade out if the user hasn't clicked the thumb
            if(!$(this).hasClass(clickedClass)) {
                $(this).fadeTo(fadeTime, inactiveOpacity);
            }
        });
     $(thumbs).click(function() {
         // Remove selected class from any elements other than this
         var previous = $(thumbs+'.'+clickedClass).eq();
         var clicked = $(this);
         if(clicked !== previous) {
             previous.removeClass(clickedClass);
         }
         clicked.addClass(clickedClass).fadeTo(fadeTime, activeOpacity);
     });
});

Answer 1

我觉得就这么简单：

$(thumbs).click(function() {
    var li = $(this);
    var alreadySelected = li.hasClass('selected');

    // Remove selected class from any elements other than this
    $('#list li').removeClass(clickedClass).fadeTo(fadeTime, inactiveOpacity);

    li.addClass(clickedClass).fadeTo(((alreadySelected) ? 0 : fadeTime), activeOpacity);
});

您无需计算哪些项目已经具有该类，只需将其从所有项目中删除，然后将其重新添加到已单击的项目中即可。

编辑：这应该消除闪烁。

Answer 2

如果您指的是人物的缩略图，它们对我来说很好。虽然有些菜单项不起作用。