SlideToggle回去和刪除類？

Question

我有3個從一開始就隱藏的元素，還有3個鏈接用slideToggle顯示它們。我正在尋找一些解決方案，讓我的代碼更簡單，更聰明。我也有這個問題，當一個元素是可見的，我點擊另一個鏈接，我希望可見的鏈接切換回來之前切換新。由於我的代碼現在只能在單擊相同鏈接時切換回來，但添加粗體字體以指示選定鏈接的類仍然變爲粗體。嗯，這可以以更好的方式完成嗎？ Precaite一些幫助！謝謝！

$(document).ready(function(){ 

$("#info").click(function() { 
$("#aktuellt").removeClass("startsida_extra_selected"); 
$("#kontakt").removeClass("startsida_extra_selected"); 
$("#info").addClass("startsida_extra_selected"); 
$("#startbild_info").slideToggle("fast"); 
}); 

$("#aktuellt").click(function() { 
$("#info").removeClass("startsida_extra_selected"); 
$("#kontakt").removeClass("startsida_extra_selected"); 
$("#aktuellt").addClass("startsida_extra_selected"); 
$("#startbild_aktuellt").slideToggle("fast"); 
}); 

$("#kontakt").click(function() { 
$("#info").removeClass("startsida_extra_selected"); 
$("#aktuellt").removeClass("startsida_extra_selected"); 
$("#kontakt").addClass("startsida_extra_selected"); 
$("#startbild_kontakt").slideToggle("fast"); 
}); 

}）;

爲jQuery的的HTML代碼：

<div id="startbild_info"> 
<p>info</p> 
</div> 

<div id="startbild_aktuellt"> 
<p>aktuellt</p> 
</div> 

<div id="startbild_kontakt"> 
<p>kontakt</p> 
</div> 

Answer 1

$(document).ready(function(){ 

    var elements = $("#info, #aktuellt, #kontakt"); 

    elements.click(function(event) { 
    event.preventDefault(); 

    var element = $(this);  
    var element_id = element.attr("id"); 
    var bild_element = $("#startbild_"+element_id); 

    elements.removeClass("startsida_extra_selected");   

    bild_element.slideToggle("fast", function(){ 
     // After the toggle is finished, check if bild_element has opened or closed 
     // If bild_element has opened the class is added to element. 
     if(bild_element.is(":visible") === true) 
     {    
      element.addClass("startsida_extra_selected"); 
     } 
    }); 
    }); 
});