我在这方面得到了其他人的帮助,但他们的回复有点过于宽泛,无法帮助我......我是 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);
});
});
最佳答案
我觉得就这么简单:
$(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);
});
您不需要计算哪些项目已经拥有该类,只需将其从所有项目中删除,然后重新添加到被点击的项目即可。
编辑:这应该消除闪烁。
关于javascript - 从所有其他列表项中删除类,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/2243978/