jQuery的toggleClass（）多類

之間，我想多元素之間toggleClass：jQuery的toggleClass（）多類

<div class='container'> 
    <div class='main'> 
     <div class='par' id='1'></div> 
     <div class='par' id='2'></div> 
     <div class='par' id='3'></div> 
     <div class='par' id='4'></div> 
    </div> 
</div>

我有這個

$('.main').delegate('.par','click',function(){ 
    $(this).toggleClass('media-clicked'); 
});

我明白，如果我點擊元素說，＃1，然後它會添加單擊媒體的類，如果再次單擊它，則會將其刪除。不過，我想點擊＃1，然後再次點擊它，點擊另一個元素，如＃4，它會刪除其他媒體點擊（＃1）。

我該怎麼做這樣的事情？

謝謝！

來源

2013-03-02 hellomello

所以基本上你想要的類移動到一個新的元素。我會建議使用「包裝」元素的可重用性。在這種情況下，具有主類的div就足夠了，這樣您可以查找當前元素的所有具有要刪除類的元素，將其刪除並將其添加到當前元素，如下所示：

// you can use .on instead of .delegate if your jquery version is > 1.7 
$('.main').delegate('.par','click',function(){ 
    $(this).sibblings(".media-clicked").removeClass("media-clicked"); 
    $(this).addClass('media-clicked'); 
});

這允許您使用具有相同結構的其他塊，並且仍然在每個塊上分別保留功能。

來源

2013-03-02 01:12:50 cernunnos

謝謝！我想你可以在最後一行切換類別，所以如果用戶再次點擊它，它會刪除？那就是我正在使用的 – hellomello 2013-03-02 01:39:30

$('.main').on('click', '.par', function() { 
    $(this).siblings('.media-clicked').removeClass(); 
    $(this).toggleClass('media-clicked'); 
});

http://jsfiddle.net/WPDGY/2/

來源

2013-03-02 01:11:34 pdoherty926

感謝您顯示.on（）方法。 +1 – hellomello 2013-03-02 01:39:58

jQuery的toggleClass（）多類

回答

相關問題