首頁 > 開發者 > JSP

Ditchnet JSP Tabs Taglis標籤的使用

來源：互聯網
上載者：User
創建阿里雲帳戶，並獲得超過 40 款產品的免費試用版；而企業帳戶則可以享有總值 $1200 的免費試用版。立即註冊！

         下載“Ditchnet JSP Tabs Taglis”的jar檔案；

         將下載包中的jar檔案複製到install_dir/tomcat/commn/lib目錄下

         確保你的web應用程式中的根目錄是可寫的

         重載你的web應用程式

         將org.ditchnet.taglib目錄拷到你的web應用程式目錄下

         在你的JSP頁面，添加tab標籤庫指示頭，和XHTML的“Transitional Doctype”(用以驗證CSS的正確性和瀏覽器的相容性－查看相關的文章Doctype Switching)

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"

"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<%@ page contentType="text/html"%>

<%@ taglib uri="http://ditchnet.org/jsp-tabs-taglib" prefix="tab"%>

<html xmlns="http://www.w3c.org/1999/xhtml" xml:lang="en" lang="en">

         添加代碼到頁面的<head>標籤中

<head>

<script type="text/javascript" src="org.ditchnet.taglib/tabs.js"></script>

<link type="text/css" rel="stylesheet" href="org.ditchnet.taglib/tabstyle.css" />

</head>

該標籤建立<script>指令碼和<link>標籤，通過它們連結必要的CSS和JavaScript到頁面。當然，你也可以添加額外的指令碼或樣式去覆蓋預設設定。

         為你希望建立的每一個tabbed pane組添加一個<tab:tabContainer>標籤

<tab:tabContainer>

</tab:tabContainer>

         給<tab:tabContainer>標籤一個id屬性，該id在你的應用程式中（即Servlet Context環境）是唯一的

<tab:tabContainer id="foo-bar-container">

</tab:tabContainer>

註：該ID在你的應用程式中必需是唯一的，因為它在使用者的會話中用於保持tab容器中被選定tab的索引。

         在tab container中添加你想添加的<tab:tabPane>標籤

<tab:tabContainer id="foo-bar-container">

<tab:tabPane></tab:tabPane>

<tab:tabPane></tab:tabPane>

</tab:tabContainer>

         為每個<tab:tabPane>標籤設定一個必需的id和tabTitle屬性。id將被無改變傳遞給頁面，tabTitle將被用於在tab container的頂部標明tabPane選項卡的標題。就像在html頁面中一樣，id對於頁面來說必須唯一。

<tab:tabContainer id="foo-bar-container">

<tab:tabPane id="foo" tabTitle="Foo!"></tab:tabPane>

<tab:tabPane id="bar" tabTitle="Bar!"></tab:tabPane>

<tab:tabContainer>

         在希望的地方添加HTML或JSP頁面內容

<tab:tabContainer id="foo-bar-container">

<tab:tabPane id="foo" tabTitle="Foo!">

Foo is cool!

</tab:tabPane>

<tab:tabPane id="bar" tabTitle="Bar!">

Bar is cool!

</tab:tabPane>

<tab:tabContainer>

註：內容不許為空白，為空白將有異常發生 

 

本文章原先以中文撰寫並發佈於 aliyun.com，亦設英文版本，僅作資訊用途。本網站不對文章的準確性，完整性或可靠性或其任何翻譯作出任何明示或暗示的陳述或保證。如對該文章有任何疑慮或投訴，請傳送電郵至 info-contact@alibabacloud.com 並提供相關疑慮或投訴的詳細說明。職員會於 5 個工作天內與您聯絡，一經驗證之後，即會刪除該侵權內容。

相關關鍵詞：
jsp book jsp 6161 tile tabs liferay tabs landfall tabs jsp editor notepad tabs
相關文章
動態網頁製作技術JSP頁面顯示亂碼問題的解決
servlet、jsp跳轉(傳值)總結及URL傳參數__js
Spring Boot 最佳實務（二）整合Jsp與生產環境部署
JSP頁面列印
用JSP實現資料庫圖片的儲存與顯示執行個體
用jsp上傳圖片檔案，存貯到欄位類型為blob的流形式代碼

聯繫我們

該頁面正文內容均來源於網絡整理，並不代表阿里雲官方的觀點，該頁面所提到的產品和服務也與阿里云無關，如果該頁面內容對您造成了困擾，歡迎寫郵件給我們，收到郵件我們將在5個工作日內處理。

如果您發現本社區中有涉嫌抄襲的內容，歡迎發送郵件至： info-contact@alibabacloud.com 進行舉報並提供相關證據，工作人員會在 5 個工作天內聯絡您，一經查實，本站將立刻刪除涉嫌侵權內容。

熱門內容

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

Get Started for Free

  • Sales Support

    1 on 1 presale consultation

    Chat Contact Sales

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

    Open a Ticket

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.

    Learn More