JQuery的OnClick動畫和if語句

Question

我一直在花費最後90分鐘左右，試圖找出這一點。我有一個使用JQuery動畫的網站，以及出現在動畫結尾處的2個鏈接。當你點擊任一鏈接時，div會淡入以顯示更多鏈接。一切工作到此爲止（僅供參考，鏈接1是「Then」，鏈接2是「Now」）。

我想要發生的是讓我們說一個用戶點擊「然後」。現在他想點擊「現在」。我希望「Then」div淡出，「Now」div淡入。反之亦然。我覺得我的代碼幾乎在那裏，但我是一個總的JS noob，似乎無法得到它。我也不想破壞我已經試圖弄清楚的東西。代碼如下：

//then + now animation 

var thennav = document.getElementById('#thennavbox'); 
var nownav = document.getElementById('#nownavbox'); 

$(document).ready(function(){ 
$('#then').click(function(){ 
    $('#thennavbox').fadeIn(1000); 
}); 

$('#now').click(function(){ 
    $('#nownavbox').fadeIn(1000); 
}); 
});//end onclick animation 

if(thennav.style.display=='none'){ 
    $('#nownavbox').fadeOut(1000, function(){ 
     $('#thennavbox').fadeIn(1000); 
     }); 
    }; 

if(nownav.style.display=='none'){ 
    $('#thennavbox').fadeOut(1000, function(){ 
     $('#nownavbox').fadeIn(1000); 
     }); 
    };//end if statements 

//end then + now animation 

就像我說過的，一切都在淡化，因爲它應該是。我不能讓一個淡出，另一個淡入。我想也許我的這些陳述是錯誤的。

Answer 1

$('#then').click(function(){ 
    $('#thennavbox').fadeIn(1000); 
    $('#nownavbox').fadeOut(1000); 

}); 

$('#now').click(function(){ 
    $('#nownavbox').fadeIn(1000); 
    $('#thennavbox').fadeOut(1000); 
});