2012-07-21 41 views
2

我有4個導航按鈕和我設計一個頁面垂直網址導航..應用CSS來使用jQuery

當用戶點擊按鈕1,我希望通過應用CSS這是很簡單的高亮顯示。但那麼,如果用戶點擊BUTTON3那麼我該如何申請相同的CSS到該按鈕(高亮)和刪除(unhighlight)

回答

3

,我曾應用於顯示Button1的CSS比如你有這樣的HTML部分:

<ul id="nav_bar"> 
    <li id="item1">Item 1</li> 
    <li id="item2">Item 2</li> 
    <li id="item3">Item 3</li> 
    <li id="item4">Item 4</li> 
</ul> 

而你有這樣的CSS:

#nav_bar li { 
    // some style here 
} 

.nav_item_clicked { 
    // something else here 
} 

而jQuery的部分:

$("#nav_bar li").click(function() { 
    $("#nav_bar li").removeClass("nav_item_clicked"); 
    $(this).addClass("nav_item_clicked"); 
}); 
+0

感謝關倫..從來沒有想過這是簡單的..你的代碼很好:) – 2012-07-21 07:56:45

2

http://jsfiddle.net/v6LA9/

$(function() { 
    $('button').click(function() { 
     $('button').removeClass("selected"); 
     $(this).addClass("selected"); 
    }); 
})​ 

這是一個函數的感情你按鈕元素 - 它會從所有的按鍵去掉」選定的類別,並將其添加到被點擊的按鈕。

+0

感謝演示..它正是我想要的.. – 2012-07-21 07:57:08

+1

歡迎你 - 歡迎標記爲答案:) – Ando 2012-07-21 08:01:50

+0

** + 1 **作爲***第一次正確答案***。 – arttronics 2012-07-21 08:17:16