国产99久久精品_欧美日本韩国一区二区_激情小说综合网_欧美一级二级视频_午夜av电影_日本久久精品视频

最新文章專題視頻專題問答1問答10問答100問答1000問答2000關鍵字專題1關鍵字專題50關鍵字專題500關鍵字專題1500TAG最新視頻文章推薦1 推薦3 推薦5 推薦7 推薦9 推薦11 推薦13 推薦15 推薦17 推薦19 推薦21 推薦23 推薦25 推薦27 推薦29 推薦31 推薦33 推薦35 推薦37視頻文章20視頻文章30視頻文章40視頻文章50視頻文章60 視頻文章70視頻文章80視頻文章90視頻文章100視頻文章120視頻文章140 視頻2關鍵字專題關鍵字專題tag2tag3文章專題文章專題2文章索引1文章索引2文章索引3文章索引4文章索引5123456789101112131415文章專題3
問答文章1 問答文章501 問答文章1001 問答文章1501 問答文章2001 問答文章2501 問答文章3001 問答文章3501 問答文章4001 問答文章4501 問答文章5001 問答文章5501 問答文章6001 問答文章6501 問答文章7001 問答文章7501 問答文章8001 問答文章8501 問答文章9001 問答文章9501
當前位置: 首頁 - 科技 - 知識百科 - 正文

基于Bootstrap的標簽頁組件及bootstrap-tab使用說明

來源:懂視網 責編:小采 時間:2020-11-27 22:34:16
文檔

基于Bootstrap的標簽頁組件及bootstrap-tab使用說明

基于Bootstrap的標簽頁組件及bootstrap-tab使用說明:bootstrap-tab bootstrap-tab組件是對原生的bootstrap-tab組件的封裝,方便開發者更方便地使用,主要包含以下功能: tab頁初始化 關閉tab頁 新增tab 顯示tab頁 獲取tab頁ID 使用 Step1 :引入樣式 <link rel=stylesheet
推薦度:
導讀基于Bootstrap的標簽頁組件及bootstrap-tab使用說明:bootstrap-tab bootstrap-tab組件是對原生的bootstrap-tab組件的封裝,方便開發者更方便地使用,主要包含以下功能: tab頁初始化 關閉tab頁 新增tab 顯示tab頁 獲取tab頁ID 使用 Step1 :引入樣式 <link rel=stylesheet

bootstrap-tab

bootstrap-tab

bootstrap-tab組件是對原生的bootstrap-tab組件的封裝,方便開發者更方便地使用,主要包含以下功能:

tab頁初始化
關閉tab頁
新增tab
顯示tab頁
獲取tab頁ID

使用

Step1 :引入樣式

<link rel="stylesheet" href="bootstrap/css/bootstrap.min.css" rel="external nofollow" >
<link rel="stylesheet" href="font-awesome/css/font-awesome.min.css" rel="external nofollow" >
<!--bootstrap-tab樣式-->
<link rel="stylesheet" href="../css/bootstrap-tab.css" rel="external nofollow" >

Step2:引入腳本

<script src="jquery/jquery-1.8.3.min.js"></script>
<script src="bootstrap/js/bootstrap.min.js"></script>
<script src="../js/bootstrap-tab.js"></script>

Step3:使用

<div id="tabContainer"></div>
<script>
 $("#tabContainer").tabs({
 data: [{
 id: 'home',
 text: '百度一下',
 url: "tab_first.html",
 closeable: true
 }, {
 id: 'admineap',
 text: 'AdminEAP',
 url: "tab_second.html"
 }, {
 id: 'edit',
 text: '編輯人員',
 url: "tab_content.html",
 closeable: true
 }],
 showIndex: 1,
 loadAll: false
 })
 $("#tabContainer").data("tabs").addTab({id: 'test', text: 'addTab', closeable: true, url: 'tab_content.html'})
</script>

參數和方法說明

參數說明

參數名稱 默認值 可選值 說明
data tab頁數據來源(對象列表),包含id,text,url,closeable屬性
id 必須,單個tab的id
text 必須,單個tab頁的標題
url 必須,單個tab頁的內容url
closeable false true,false 單個tab頁是否可關閉
showIndex 0 默認顯示頁的索引
loadAll true true,false true=一次全部加在頁面,false=只加在showIndex指定的頁面,其他點擊時加載,提高響應速度

方法說明

方法名稱 參數 參數說明 方法說明
init tab組件初始化入口方法
builder data tab數據 構建tab頁的主方法
loadData 加載tab頁的內容,根據loadAll即時加載或者點擊時加載
addTab obj 單個tab的數據 增加一個tab頁
showTab tabId tab的id 根據id顯示tab頁
getCurrentTabId 獲取當前活動tab頁的ID

相關鏈接

如何寫一個前端組件(以bootstrap-tab為例)

bootstrap-tab的Github地址:https://github.com/bill1012/bootstrap-pager

總結

以上所述是小編給大家介紹的基于Bootstrap的標簽頁組件及bootstrap-tab使用說明,希望對大家有所幫助,如果大家有任何疑問請給我留言,小編會及時回復大家的。在此也非常感謝大家對腳本之家網站的支持!

聲明:本網頁內容旨在傳播知識,若有侵權等問題請及時與本網聯系,我們將在第一時間刪除處理。TEL:177 7030 7066 E-MAIL:11247931@qq.com

文檔

基于Bootstrap的標簽頁組件及bootstrap-tab使用說明

基于Bootstrap的標簽頁組件及bootstrap-tab使用說明:bootstrap-tab bootstrap-tab組件是對原生的bootstrap-tab組件的封裝,方便開發者更方便地使用,主要包含以下功能: tab頁初始化 關閉tab頁 新增tab 顯示tab頁 獲取tab頁ID 使用 Step1 :引入樣式 <link rel=stylesheet
推薦度:
標簽: 使用 ta 的使用
  • 熱門焦點

最新推薦

猜你喜歡

熱門推薦

專題
Top
主站蜘蛛池模板: 另类专区 亚洲 | 精品国产欧美一区二区三区成人 | 97在线资源| 久久久久久国产a免费观看黄色大片 | 最新国产在线 | 老司机精品视频一区二区 | 欧美日韩国产另类一区二区三区 | 成人欧美日韩 | 亚洲欧美网址 | 成人免费视频一区二区 | 国产在线精品99一卡2卡 | 毛片资源| 悠悠久久 | 国产一区二区精品久久凹凸 | 亚洲 欧美 综合 | 欧美日韩中文 | 欧美在线视频观看 | 欧美成人一区二区 | 国产一级高清视频免费看 | 精品在线免费播放 | 欧美在线色图 | 日韩免费一区二区三区 | 久久91精品国产91久久户 | 视频精品一区二区 | 亚洲国产成人精品久久 | 日本全黄视频 | 国产最新网址 | 国产原创一区 | 欧美在线日韩 | 欧美日韩亚洲精品国产色 | 亚洲 欧美 日韩 在线 | 91精品欧美一区二区三区 | 欧美日韩亚洲高清不卡一区二区三区 | 欧美在线看欧美视频免费网站 | 午夜看一级特黄a大片黑 | 国产精品一二区 | 精品久久久久久久久中文字幕 | 久久久无码精品亚洲日韩按摩 | 永久在线毛片免费观看 | 一级成人a毛片免费播放 | 亚洲 欧美 自拍 另类 欧美 |