單頁網站，顯示/隱藏div，菜單按鈕不會保持選中狀態

Question

我正在嘗試制作一個帶有菜單的單頁網站（圖片，css翻轉...），當點擊每個菜單按鈕時，它將顯示不同的div。 雖然只有一個div會被顯示，如果一個已經打開，它應該被隱藏。 這很好用。

我遇到的問題是顯示結果的菜單按鈕不會保持選中狀態，即與翻轉相同的圖片（懸停）。

HTML：

<ul class="menu">
    <li class="home"><a href="javascript:showHide('content1');" title="Home"><span class="displace"></span></a></li>
    <li class="credits"><a href="javascript:showHide('content2');" title="Credits"><span class="displace"></span></a></li>
    <li class="idea"><a href="javascript:showHide('content3');" title="Idea"><span class="displace"></span></a></li>
</ul>

<div id="content1">home text</div>
<div id="content2">credits text1</div>
<div id="content3">idea text</div>​

JS / jQuery：

function showHide(d)
{
var onediv = document.getElementById(d);
var divs=['content1','content2','content3'];
for (var i=0;i<divs.length;i++)
  {
  if (onediv != document.getElementById(divs[i]))
    {
    document.getElementById(divs[i]).style.display='none';
    }
  }
onediv.style.display = 'block';
}


$(function stay() {
    $('menu').click(function stay() {
            $('menu').removeClass('selected');
            $(this).addClass('selected');

    });
});
​

演示： http ： //jsfiddle.net/anKT3/159/

我已經嘗試創建一個改變課程的功能，但我沒有運氣。

Answer 1

這是JS小提琴

$(function stay() {
    $('ul.menu li a').click(function () {
            $('ul.menu li a').removeClass('selected');
            $(this).addClass('selected');

    });
});

Answer 2

將stay()函數更改為如下：

$(function stay() {
    $('.menu li a').click(function stay() {            
            $('.menu li a').removeClass('selected');
            $(this).addClass('selected');                        
    });
});