選項卡式界面是本地桌面應用較大的UI組件之一 幸運的是 jQueryUI 使它們很容易實現 下面是如何讓它們迅速啟動並正常運行
HTML的基本結構如下:
<div id="tab_wrapper">
<ul>
<li><a href="#tab">Tab </li>
<li><a href="#tab">Tab </li>
</ul>
<div id="tab">
Tab content here
</div>
<div id="tab">
Tab content here
</div>
</div>
通過單一ID的div指定這些錨變成標簽標簽的列表將會在網頁選項卡顯示當用戶單擊鏈接時它將選擇該選項卡 只有短短的一行jQuery代碼可以把這個HTML轉換為選項卡式界面:
$(function() {
$( "#tab_wrapper" )tabs();
});
多簡潔的代碼! 我們甚至可以實現更進一步的功能 該文檔展示了較全功能 但我認為最有用的還是從外部來源加載數據 通過使用的錨點到另一個頁面的ID而不是屏幕上一個項目點擊選項卡時它會自動加載資源內容將通過AJAX加載 演示代碼所示 你可以很容易地在有回退功能的服務器上處理錯誤
From:http://tw.wingwit.com/Article/program/Java/JSP/201311/20004.html