如何使用多個div來切換div內容？

Question

我想切換我的內容使用兩個不同的div。如果我點擊類「打開」這個打開的內容，並關閉內容我點擊與類「關閉」單獨的div。

<div class="open"></div> 
<div class="close"></div> 

<div id="contents"></div> 

我該如何做到這一點？

這是我的腳本：

$('.open').toggle(function(){ 
    $('#contents').hide(); 
    $('.wrapper').animate({'width':'200px'}).end().find('.content').animate({ 'right': '30px' }) 
}, 
function() { 
    $('#contents').show();  
    $('.wrapper').animate({'width':'40px'}).end().find('.content').animate({ 'right': '0' })  
}); 

謝謝！

Answer 1

您可以單擊事件處理程序綁定到不同的元素

$('div.open').click(function(){ 
    // your open code here 
}); 
$('div.close').click(function(){ 
    // your close code here 
}); 

Answer 2

$(".open").click(function() { 
    $("#contents").show(); 
}); 

$(".close").click(function() { 
    $("#contents").hide(); 
}); 

Answer 3

在2個單擊功能

$('.close').click(function(){ 
    $('#contents').hide(); 
    $('.wrapper').animate({'width':'200px'}).end().find('.content').animate({ 'right': '30px' }) 
}); 
$('.open').click(function() { 
    $('#contents').show();  
    $('.wrapper').animate({'width':'40px'}).end().find('.content').animate({ 'right': '0' })  
});