用簡單JS外掛切換tab，首先，

1.
下載：jquery.tab.js的外掛。


2.
加入以下這一段：

<script type="text/javascript" src="/../js/jquery.tab.js"></script>（←路徑記得改啊！）
<script type="text/javascript">


//tab切換JS
 $(function(){
// 預設顯示第一個 Tab
var _showTab = 0;
$('.page_tab').each(function(){
// 目前的頁籤區塊
var $tab = $(this);

var $defaultLi = $('ul.tabs li', $tab).eq(_showTab).addClass('active');
$($defaultLi.find('a').attr('href')).siblings().hide();

// 當 li 頁籤被點擊時...
// 若要改成滑鼠移到 li 頁籤就切換時, 把 click 改成 mouseover
$('ul.tabs li', $tab).click(function() {
// 找出 li 中的超連結 href(#id)
var $this = $(this),
_clickTab = $this.find('a').attr('href');
// 把目前點擊到的 li 頁籤加上 .active
// 並把兄弟元素中有 .active 的都移除 class
$this.addClass('active').siblings('.active').removeClass('active');
// 淡入相對應的內容並隱藏兄弟元素
$(_clickTab).stop(false, true).fadeIn().siblings().hide();

return false;
}).find('a').focus(function(){
this.blur();
});
});
});
 </script>



3.
接著，你的div架構應該要是這樣，標註的橘黃色屬性都是務必對應正確的地方：

<div class="page_tab">   // 這page_tab正是對應前面的JS的，可改。但注意一定要包住選單跟內文
　　<div class="menu">
　　　　<ul class="tabs">   // 選單的ul需加上tabs，以便前面JS抓取這段：ul.tabs li
　　　 　　<li class="active"><a href="#tab1">選單一</a></li>   // 首要顯示的li請加上active,並標註好ID
　　　 　　<li><a href="#tab2">選單二</a></li> 
　　　 　　 <li><a href="#tab2">選單三</a></li>
　　　　 </ul>
　 　</div>
　 　<div class="page">
　　　　 <div id="tab1">
　　　　　 內文一
　　　　 </div>
　　　　<div id="tab2">
　　　　　 內文一
　　　　</div>
　　　　 <div id="tab3">
　　　　　 內文一
　　　　</div>
　　</div>
</div>


※另外記得<li>要包住<a>，用<a>包住<li>是會沒有效果的喔。 就是那麼簡單。