选择元素并将类[selected]添加到其他元素，同时从所有其他类中删除类[selected]

我试图自己找到答案，但没有找到任何可帮助我解决问题的结果问题。原因可能是我没有足够清晰地表达我的问题以找到答案，或者没有意识到我在我面前有答案，而且无法理解它。选择元素并将类[selected]添加到其他元素，同时从所有其他类中删除类[selected]

因为在我的很多谷歌搜索这个网站来了我想，经过两天的搜索，我应该注册并自己问问题。

我做了一个快速的jsfiddle，它基本上解决了我的问题，但代码非常重复，可能适合一些元素，它会以指数方式炸毁我的网站。

我的jsfiddle：http://jsfiddle.net/3Unhe/1/

答案可能是简单的，但我有基本的JavaScript/jQuery的的零知识。

我的想法来解决这个更好的方式是用简单的英语：如果#ID点击所有.container .selected 删除类id's .selected到.container＃ID

html: 
<div class="titel1">titel</div> 
<div class="foto1">foto</div> 
<div class="name1">name</div> 
<br /> 
<a href="javascript:void(0);" class="titel"> 
selected titel 
</a> 
<br /> 
<a href="javascript:void(0);" class="foto"> 
selected foto 
</a> 
<br /> 
<a href="javascript:void(0);" class="name"> 
    selected name 
</a> 

jQuery: 
$('.titel').click(function() { 
    $('.name1').removeClass('selected'); 
    $('.foto1').removeClass('selected'); 
    $('.titel1').addClass('selected'); 
}); 

$('.foto').click(function() { 
    $('.titel1').removeClass('selected'); 
    $('.name1').removeClass('selected'); 
    $('.foto1').addClass('selected'); 
}); 

$('.name').click(function() { 
    $('.foto1').removeClass('selected'); 
    $('.titel1').removeClass('selected'); 
    $('.name1').addClass('selected'); 
}); 


css: 
.selected { 
font-weight:bold; 
}

添加类任何帮助表示赞赏。无论你是完全解决问题还是提供一个链接/想法来帮助我自己解决问题。我不是在这里发帖，因为我很懒，但我无法解决它，我不知道如何更好地阐明我的问题，找到自己的答案。

即使我使用jquery，我完全正确地使用javascript代替。

非常感谢。

Freubau

来源

2014-07-26 freubau

这个http://jsfiddle.net/3Unhe/2/ –

非常感谢。它的工作原理我只是需要了解它才能使用它，但我相信我会自己解决它。 – freubau

尝试：

$('.titel1, .foto1, .name1').on("click",function(){ 

    $("."+$(this).attr("class").substr(0, $(this).attr("class").length-1)) 
    .addClass("selected") 
    .siblings() 
    .removeClass("selected"); 

});

这将寻找具有相同类名的点击的元素具有的元素，但是没有它的最后字符。

铁：点击元素.titel1将

添加 “selected” 类.titel，并
删除 “selected” 类从它的兄弟姐妹（.foto和.name）

来源

2014-07-26 12:36:37

它能够在jsfiddle中工作，所以非常感谢。我现在需要弄清楚如何在我的网站中实现它。 – freubau

不用担心:)如果您发现我的答案有用，请随时注册，如果您已经找到满意的答案，请接受它。 :)玩得开心编码！ –

我想，但事实证明我需要15点声望。：/ – freubau

在这里你去=>http://jsfiddle.net/3Unhe/4/

$('.titel1, .foto1, .name1').click(function(){ 
    $(this).siblings('.selected').removeClass('selected'); 
    $(this).addClass('selected'); 
});

来源

2014-07-26 12:05:42

谢谢你回复我的问题。但我不想将类添加到单击的元素。我想添加一个类到相应的元素。就像在我的例子中，你点击[selected titel]，它会使[titel]变大。 – freubau

不客气，这是你想要的吗？ –

我认为http://stackoverflow.com/users/1661928/mohit-arora解决了它。 – freubau

选择元素并将类[selected]添加到其他元素，同时从所有其他类中删除类[selected]

回答

相关问题