如何刪除班級點擊內部div

Question

我有兩個div。點擊時，它會打開，另一個關閉。我希望能夠通過單擊其他div或單擊「[x]」來關閉當前打開的div。我已經得到了第一部分正常工作，但當前div只是點擊「[x]」後才切換類而不是關閉。

$("main-element .close").click(function() { 

     if($('.main-element').hasClass("open")) { 
      $('.main-element').removeClass("open").addClass("closed"); 
     } 
}); 


$(".main-element").click(function() { 

     if($(this).hasClass("open")) { 
      $(this).removeClass("open").addClass("closed"); 
     } else { 
      $(this).siblings().removeClass("open").addClass("closed"); 
      $(this).removeClass("closed").addClass("open"); 
     } 

}); 

我已經添加了jsFiddle來幫助解釋它好一點。

Answer 1

這裏試試這個代碼：http://jsfiddle.net/kuYRh/56/

的關鍵是e.stopPropagation()自[X]是div

Answer 2

怎麼樣toggleClass的做法？我唯一可以說的是，這並沒有完成，事實上，您仍然可以通過單擊圖像來關閉該框。 （不是.main元素背景 - 但是圖像）〜我喜歡反正。這簡化了一些事情。這是假設你把所有其他jQuery消除並從CSS中刪除不再需要的任何類的代碼。

jQuery的

$(".main-element img, .close").click(function() { 
    $(this).closest('.main-element').toggleClass("open"); 
}); 

CSS

.main-element { 
    width:200px; 
    height:200px; 
} 

.open { 
    height:440px; 
    width:440px; 
}