更新內容DIV，另一個DIV

Question

的點擊我有這個FIDDLE

$('body').click(function() { 
    $('#moreinfo').addClass('hidden'); 
    $('.trigger').parent().removeClass('active'); 
}); 

$('#moreinfo').addClass('hidden'); 
$('.portfoliotile .description').addClass('hidden'); 

$('.trigger').click(function(e){ 
    e.stopPropagation(); 
    $('#moreinfo').removeClass('hidden'); 
    $(this).parent().addClass('active'); 
    $('#details').html($(this).parent().find('.description').html()); 

}); 

$('#closegall').click(function(){ 
    $('#moreinfo').addClass('hidden'); 
    $('.portfoliotile').removeClass('dark'); 
}); 

當你點擊紅色框圖像上，從紅框中的文本出現在黃色的盒子。另外，當您單擊紅色框圖像時，會在紅色框中添加「活動」類，從而更改其不透明度。

但是，當你點擊第二個紅色框時，第一個紅色框仍然保持「活動」類，所以現在，兩個紅色框都有這個「活動」類。

我想每次只有一個「主動」類，無論您點擊哪個紅色框應該是「主動」類。

如果您可以在更新的小提琴上演示我，那我將不勝感激！

Answer 1

用戶可於當你點擊一個.trigger與$('.portfoliotile').removeClass('active')所有.portfoliotile元素清除活性類：

$('.trigger').click(function(e) { 
    e.stopPropagation(); 
    $('.portfoliotile').removeClass('active') 
    $('#moreinfo').removeClass('hidden'); 
    $(this).parent().addClass('active'); 
    $('#details').html($(this).parent().find('.description').html()); 
}); 

jsFiddle example