第16章項目-知問前端選項卡

16--學習要點修改tabs樣式主講教師：合作一．使使用tabs比較簡單，但需要按照指定的規(guī)范即<div<li><a<li><a<li><a<divid="tabs1">tab1-<divid="tabs2">tab2-<divid="tabs3">tab3-二．修改tabs樣們tabs的樣式，根據樣式進行修改。我們?yōu)榱撕头?，對tabs的標題背//無須修改ui里的CSS，直接用style.css替代{}#tabs{}//#tabs1,#tabs2,#tabs3{top:-}三．tabs()方法的屬選項卡方法有兩種形式：1.tabs(options)，options是以對象鍵值對的形式傳參，每個鍵值對表示一個選項；2.tabs('actionparam)，action是操作選項卡方法的字符串，param則是options的某個選項。屬默認值/類說false/布爾當設置為true是，允許選項卡折疊對應的內容。默認值為false，不會關閉對應內容無/數使用數組來指定禁用哪個選項卡的索引[0,1]來禁用前兩個選項卡click/字符觸發(fā)tab的事件類型，默認click?？梢栽O置mouseover等其他鼠標事件數組和布爾如果是數組，初始化時默認顯示哪個tab，默認0。如果是布爾值，那么默認是否折疊。條件必須collapsibletrue。content/字符動根據最高的那個為基準，fill則是填充一定的可用高度false/布爾切換選項卡時，默認采用淡入效果切換選項卡時，默認采用淡出效果collapsible:true,disabled:[0],event:'mouseover',active:false,heightStyle:hide:true,show:true,特效名說框從頂部顯示或框斷斷續(xù)續(xù)地顯示或，垂直運框從中心垂直地顯示或框從左邊顯示或框從左邊顯示或，有變框從左上角顯示或框顯示或，伴隨著和背景色的變框從中心開始縮放。顯示時“收縮”，時“生長框從中心開始縮放。顯示時“生長”，時“收縮框以閃爍形式顯示或三．tabs()方法的事除了屬性設置外，ab()方法也提供了大量的事件。這些事件可以給各種不同狀態(tài)時提供回調函數。說當創(chuàng)建一個選項卡時激活此事件。該方法有兩個參數當切換一個活動卡時，啟動此事件。該方法有兩個參數(event,ui)，ui參數有四個子屬性newTab、nenel、oldTab，oldPanel。分別得到的時候新tab對象、新內容對象、舊tab對象和舊內容對象數(event,ui)，ui參數有四個子屬性newTab、nenel、oldTab，oldPaneltab對象、新內容對象、舊tab對象和舊內容對象當ajax加載一個文檔后激活此事件。該方法有兩個參數當ajax加載一個文檔前激活此事件。該方法有兩個參數(event,ui)，ui參數有tabpanel以及jqXHR和ajaxSettings，前兩個得到當前活動卡和內容選項的對象，后兩個是ajax操作對象//當選項卡創(chuàng)建時觸create:function(event,{//當切換到一個活動卡時觸activate:function(event,alert($(ui.newTab.get()) //當切換到一個活動卡之前觸beforeActivate:function(event,{alert($(ui.oldTab.get())alert($(ui.newTab.get())在使用load和beforeLoad事件之前，我們先要了解一下ajax調用的基本方法<li><a<li><a<li><atabs1.html、tabs2.htmltabs3html只要書寫即可，無須包含<div>。比如tabs1-而這個時候，我們的CSS需要做一定的修改，只要將之前的ID換成如下即可load:function(event,{}beforeLoad:function(event,{ui.ajaxSettings.url='tabs2html';ui.jqXHR.success(function(responseText){}tabs('action',param)方方說禁用選項啟用選項通過ajax獲取選項卡內獲取選項卡的jQuery對刪除選項卡，直接阻斷了tabs更新選項卡，比如高獲取options屬性的設置options屬性的//禁用選項 //$('#tabs').tabs('disable',//啟用選項 //$('#tabs').tabs('enable',//獲取選項jQuery對//更新選項//重載指定選項卡內$('#tabs').tabs('load',alert($('#tabs').tabs('option',五．tabs在tabs的事件中，提供了使用on()方法處理的事件方法on()方法觸發(fā)的選項卡特效名說選