JQUERY插件学习之jQuery UI
?
jQuery UI:http://jqueryui.com/
jQuery UI介紹:
jQuery UI 是以 jQuery 為基礎(chǔ)的開源 JavaScript 網(wǎng)頁(yè)用戶界面代碼庫(kù)。包含底層用戶交互、動(dòng)畫、特效和可更換主題的可視控件。我們可以直接用它來(lái)構(gòu)建具有很好交互性的web應(yīng)用程序。所有插件測(cè)試能兼容 IE 6.0+, Firefox 3+, Safari 3.1+, Opera 9.6+, 和 Google Chrome。
組件構(gòu)成
jQuery UI 主要分為3個(gè)部分：交互、微件和效果庫(kù)。
交互
交互部件是一些與鼠標(biāo)交互相關(guān)的內(nèi)容，包括Draggable,Droppable,Resizable,Selectable和Sortable等。
微件
主要是一些界面的擴(kuò)展，包括Accordion,AutoComplete,ColorPicker,Dialog,Slider,Tabs,DatePicker,Magnifier,ProgressBar,Spinner等，新版本的UI將包含更多的微件。
效果庫(kù)
用于提供豐富的動(dòng)畫效果，讓動(dòng)畫不再局限于jQuery的animate()方法。
編輯本段其它
jQuery UI實(shí)際上是jQuery插件，專指由jQuery官方維護(hù)的UI方向的插件
jQuery UI 與 jquery 的主要區(qū)別是：
(1) jQuery是一個(gè)js庫(kù)，主要提供的功能是選擇器，屬性修改和事件綁定等等。
(2) jQuery UI則是在jQuery的基礎(chǔ)上，利用jQuery的擴(kuò)展性，設(shè)計(jì)的插件。提供了一些常用的界面元素，諸如對(duì)話框、拖動(dòng)行為、改變大小行為等等。
(3) jQuery本身注重于后臺(tái)，沒有漂亮的界面，而jQuery UI則補(bǔ)充了前者的不足，他提供了華麗的展示界面，使人更容易接受。既有強(qiáng)大的后臺(tái)，又有華麗的前臺(tái)。
jQueryUI tab
1 屬性
1.11 ajaxOptions,當(dāng)選項(xiàng)卡加載內(nèi)容時(shí)，添加一個(gè)ajax選項(xiàng)。只有ajax時(shí)，添加的ajax選項(xiàng)才起作用。默認(rèn)值為null。上面的例子中，添加了beforeSend和success兩個(gè)選項(xiàng)。ajax還有一些選項(xiàng)請(qǐng)參考jquery ajax，這里不做詳解。。。
1.12 初始化設(shè)置例：請(qǐng)注意，$('.selector')是tabs 的類名，在本例中.selector=#tabs,以后不再說(shuō)明。
$('.selector').tabs({ ajaxOptions: { async: false } });//這里是將異步改為了同步。
1.13 初始化后的參數(shù)獲取和設(shè)置：請(qǐng)注意：getter為獲取，發(fā)音：蓋特兒，setter為設(shè)置，發(fā)音：塞特兒，以后不再說(shuō)明。
//getter
var ajaxOptions = $('.selector').tabs('option', 'ajaxOptions');
//setter
$('.selector').tabs('option', 'ajaxOptions', { async: false });
1.21 cache 默認(rèn)為false，無(wú)緩存。這個(gè)選項(xiàng)用于ajax調(diào)用，簡(jiǎn)單的說(shuō)無(wú)緩存，就是每次發(fā)送請(qǐng)求都刷新；有緩存就是第一次請(qǐng)求刷新，以后就不刷新了，關(guān)閉頁(yè)面是另外一回事。ajaxOptions:{cache:false}應(yīng)該和這個(gè)功能是一樣的吧。
1.22 初始化設(shè)置例：
$('.selector').tabs({ cache: true });
2.23 初始化后的參數(shù)獲取和設(shè)置：
//getter
var cache = $('.selector').tabs('option', 'cache');
//setter
$('.selector').tabs('option', 'cache', true);
1.31collapsible，意思是可折疊的，默認(rèn)選項(xiàng)是false，不可以折疊。如果設(shè)置為true，允許用戶將已經(jīng)選中的選項(xiàng)卡內(nèi)容折疊起來(lái)。這樣說(shuō)吧：點(diǎn)擊一次選項(xiàng)卡2，選項(xiàng)卡2內(nèi)容顯示出來(lái)了，這時(shí)候再次點(diǎn)擊選項(xiàng)卡2，選項(xiàng)卡的內(nèi)容區(qū)就收了起來(lái)，再次點(diǎn)擊選項(xiàng)卡2，選項(xiàng)卡的內(nèi)容區(qū)則又展開了。明白否？知道你不明白，不明白就用最上面的例子試試吧。
1.32 初始化設(shè)置例：
$('.selector').tabs({ collapsible: true });
1.33 初始化后的參數(shù)獲取和設(shè)置：請(qǐng)參考1.23...
1.41 cookie 默認(rèn)值為null，需要cookie插件。保存最后一次選擇的選項(xiàng)卡到cookie 中?？墒褂玫倪x項(xiàng)例：(example): { expires: 7, path: '/', domain: 'jquery.com', secure: true }.
1.42 初始化設(shè)置例：$('.selector').tabs({ cookie: { expires: 30 } });
1.43 初始化后的參數(shù)獲取和設(shè)置：請(qǐng)參考1.23...
1.51deselectable 默認(rèn)為false，作用似乎和collapsible一樣。
1.61 disabled 設(shè)置哪些選項(xiàng)卡不可用，是一個(gè)數(shù)組例[0,1,2]，也就是第一個(gè)、第二個(gè)、第三個(gè)選項(xiàng)卡。默認(rèn)為[]。
1.62 初始化設(shè)置例：$('.selector').tabs({ disabled: [1, 2] });
1.63 初始化后的參數(shù)獲取和設(shè)置：請(qǐng)參考1.23...
1.71 event ，切換選項(xiàng)卡的事件，默認(rèn)為'click'，點(diǎn)擊切換選項(xiàng)卡。
1.72 初始化設(shè)置例：$('.selector').tabs({ event: 'mouseover' }); //鼠標(biāo)滑過(guò)切換選項(xiàng)卡
1.73 初始化后的參數(shù)獲取和設(shè)置：請(qǐng)參考1.23...
1.81 fx，切換選項(xiàng)卡時(shí)的動(dòng)畫效果，默認(rèn)為：null，無(wú)動(dòng)畫效果，
1.82 初始化設(shè)置：請(qǐng)參看最上面的例子。
1.83 初始化后的參數(shù)獲取和設(shè)置：請(qǐng)參考1.23...
1.91 idPrefix ，在使用ajax時(shí)，idPrefix選項(xiàng)可以為其添加一個(gè)唯一的id，默認(rèn)為：'ui-tabs-' 。
1.92 初始化設(shè)置例：$('.selector').tabs({ idPrefix: 'ui-tabs-primary' });
1.93 初始化后的參數(shù)獲取和設(shè)置：請(qǐng)參考1.23...
1.101 selected，初始化時(shí)，哪個(gè)選項(xiàng)卡被選中，默認(rèn)為0，就是第一個(gè)選項(xiàng)卡被選中。
1.102 初始化設(shè)置例：$('.selector').tabs({ selected: 3 });
1.103 初始化后的參數(shù)獲取和設(shè)置：請(qǐng)參考1.23...
1.111 spinner，當(dāng)遠(yuǎn)程內(nèi)容加載的時(shí)候，（ajax），spinner字符串的html內(nèi)容將被顯示在選項(xiàng)卡的標(biāo)題上。（我很奇怪，我自己試了，怎么不起作用？）
1.112 初始化設(shè)置例：$('.selector').tabs({ spinner: 'Retrieving data...' });
1.113 初始化后的參數(shù)獲取和設(shè)置：請(qǐng)參考1.23...
1.121 panelTemplate ,
1.131 tabTemplate ,
2 事件
先給出一個(gè)事件綁定的例子，請(qǐng)注意：
$('#example').bind('tabsselect', function(event, ui) {
ui.tab???? // 被選中（點(diǎn)擊后）的選項(xiàng)卡元素
ui.panel?? //這個(gè)元素包含被選中（點(diǎn)擊后）的選項(xiàng)卡的內(nèi)容
ui.index?? //返回一個(gè)被選中（或點(diǎn)擊后）選項(xiàng)卡的索引值（從0開始）
});
2.11 select 類型：tabsselect ，點(diǎn)擊選項(xiàng)卡時(shí)觸發(fā)該事件。
2.12 初始化時(shí)綁定事件：
$('.selector').tabs({
?? select: function(event, ui) { ... }
});
2.13 在初始化后使用事件綁定綁定該事件：
$('.selector').bind('tabsselect', function(event, ui) {
...
});
2.21 load，類型：tabsload 一個(gè)遠(yuǎn)程（ajax）選項(xiàng)卡的內(nèi)容被加載完成后觸發(fā)該事件。
2.22 參考2.12
2.23 參考2.13
2.31 show，類型：tabsshow 當(dāng)選項(xiàng)卡顯示后觸發(fā)該事件。
2.41 add，類型：tabsadd ，當(dāng)一個(gè)選項(xiàng)卡被添加后觸發(fā)。
2.51 remove ，類型tabsremove ，當(dāng)一個(gè)選項(xiàng)卡被刪除后觸發(fā)。
2.61 enable ，類型tabsenable ，當(dāng)一個(gè)選項(xiàng)卡可用時(shí)觸發(fā)。
2.71 disable，類型tabsdisable，當(dāng)一個(gè)選項(xiàng)卡不可用時(shí)觸發(fā)。
3 方法
3.11 destroy，哈哈，又到了我最喜歡的摧毀地球時(shí)間。例：.tabs( 'destroy' )
3.21 disable，整個(gè)選項(xiàng)卡不可用。
3.31 enable，整個(gè)選項(xiàng)卡可用。.tabs( 'enable' )
3.41 option，設(shè)置屬性。例：.tabs( 'option' , optionName , [value])
3.51 add，remove，添加、刪除選項(xiàng)卡。例：.tabs( 'add' , url , label , [index]) ，.tabs( 'remove' , index )
3.61 enable，設(shè)置某個(gè)選項(xiàng)卡標(biāo)簽可用。例：.tabs( 'enable' , index )
3.71 disable，設(shè)置某個(gè)選項(xiàng)卡標(biāo)簽不可用。例：.tabs( 'disable' , index )
3.81 select，選擇一個(gè)選項(xiàng)卡標(biāo)簽。例：.tabs( 'select' , index ) ，index從0開始。
3.91 load，重載一個(gè)ajax選項(xiàng)卡的內(nèi)容，這個(gè)一直載入遠(yuǎn)程內(nèi)容，即使cache設(shè)置為true，第二個(gè)參數(shù)是要重載選項(xiàng)卡的索引值。例：.tabs( 'load' , index )
3.101 url，當(dāng)一個(gè)ajax選項(xiàng)卡將要加載時(shí)，改變url。.tabs( 'url' , index , url )
3.111 abort，中止所有運(yùn)行在tab標(biāo)簽上的ajax請(qǐng)求或動(dòng)畫。.tabs( 'abort' )
3.121 rotate， 自動(dòng)翻滾選項(xiàng)卡標(biāo)簽。.tabs('rotate',ms,[countinue]),第二個(gè)參數(shù)是毫秒，是兩個(gè)標(biāo)簽自動(dòng)翻滾所需要的時(shí)間，設(shè)為0或null為停止翻滾。第三個(gè)參數(shù)是設(shè)置當(dāng)用戶選擇一個(gè)選項(xiàng)卡標(biāo)簽后是否繼續(xù)翻滾，默認(rèn)為：false，不繼續(xù)。
真累，歇歇再說(shuō)吧。。。
4 技巧
4.1 如何接收已選中選項(xiàng)卡標(biāo)簽的索引值？
例：var $tabs = $('#example').tabs();
var selected = $tabs.tabs('option', 'selected'); // => 0
4.2 如何用一個(gè)其它元素代替選項(xiàng)卡單擊事件來(lái)切換選項(xiàng)卡？
例：var $tabs = $('#example').tabs(); // 第一個(gè)標(biāo)簽被選中
$('#my-text-link').click(function() { // 綁定單擊事件
??? $tabs.tabs('select', 2); // 切換到第三個(gè)選項(xiàng)卡標(biāo)簽
??? return false;
});
4.3 如何立刻選擇剛添加的選項(xiàng)卡標(biāo)簽？
例：var $tabs = $('#example').tabs({
??? add: function(event, ui) {
??????? $tabs.tabs('select', '#' + ui.panel.id);
??? }
});
4.4 如何在一個(gè)新窗口中打開選項(xiàng)卡標(biāo)簽？
例：$('#example').tabs({
??? select: function(event, ui) {
??????? location.href = $.data(ui.tab, 'load.tabs');
??????? return false;
??? }
});
jQuery UI dialog
1 屬性
1.11 autoOpen ，這個(gè)屬性為true的時(shí)候dialog被調(diào)用的時(shí)候自動(dòng)打開dialog窗口。當(dāng)屬性為false的時(shí)候，一開始隱藏窗口，知道.dialog("open")的時(shí)候才彈出dialog窗口。默認(rèn)為：true。
1.12 初始化例：請(qǐng)注意，$('.selector')是dialog 的類名，在本例中.selector=#dialoag,以后不再說(shuō)明。
$('.selector').dialog({ autoOpen: false });
1.13 初始化后，得到和設(shè)置此屬性例：
//獲得
var autoOpen = $('.selector').dialog('option', 'autoOpen');
//設(shè)置
$('.selector').dialog('option', 'autoOpen', false);
1.21 bgiframe 默認(rèn)為false ，When true, the bgiframe plugin will be used, to fix the issue in IE6 where select boxes show on top of other elements, regardless of zIndex. Requires including the bgiframe plugin. Future versions may not require a separate plugin.
在IE6下，讓后面那個(gè)灰屏蓋住select。
1.22 初始化例：
$('.selector').dialog({ bgiframe: true });
1.23 初始化后，得到和設(shè)置：
//獲取
var bgiframe = $('.selector').dialog('option', 'bgiframe');
//設(shè)置
$('.selector').dialog('option', 'bgiframe', true);
1.31 buttons 顯示一個(gè)按鈕，并寫上按鈕的文本，設(shè)置按鈕點(diǎn)擊函數(shù)。默認(rèn)為{}，沒有按鈕。
最上面的例子中已經(jīng)有buttons屬性的用法，請(qǐng)注意。
1.32 初始化例：
$('.selector').dialog({ buttons: { "Ok": function() { $(this).dialog("close"); } } });
1.33 初始化后，得到和設(shè)置：
//獲取
var buttons = $('.selector').dialog('option', 'buttons');
//設(shè)置
$('.selector').dialog('option', 'buttons', { "Ok": function() { $(this).dialog("close"); } });
1.41 closeOnEscape 為true的時(shí)候，點(diǎn)擊鍵盤ESC鍵關(guān)閉dialog，默認(rèn)為true；
1.42 初始化例：
$('.selector').dialog({ closeOnEscape: false });
1.43 初始化后，得到和設(shè)置：
//獲取
var closeOnEscape = $('.selector').dialog('option', 'closeOnEscape');
//設(shè)置
$('.selector').dialog('option', 'closeOnEscape', false);
1.51 dialogClass 類型將被添加到dialog，默認(rèn)為空
1.52 初始化例：
$('.selector').dialog({ dialogClass: 'alert' });
1.53 初始化后，得到和設(shè)置：
//獲取
var dialogClass = $('.selector').dialog('option', 'dialogClass');
//設(shè)置
$('.selector').dialog('option', 'dialogClass', 'alert');
1.61 draggable、resizable : draggable是否可以使用標(biāo)題頭進(jìn)行拖動(dòng)，默認(rèn)為true，可以拖動(dòng);resizable是否可以改變dialog的大小，默認(rèn)為true，可以改變大小。
1.62 初始化例：
$('.selector').dialog({ draggable: false,resizable:false });
1.63 初始化后，得到和設(shè)置：
//獲取
var draggable = $('.selector').dialog('option', 'draggable');
//設(shè)置
$('.selector').dialog('option', 'draggable', false);
1.71 width、height ，dialog的寬和高，默認(rèn)為auto，自動(dòng)。
1.72 初始化例：
$('.selector').dialog({ height: 530,width:200 });
1.73 初始化后，得到和設(shè)置：請(qǐng)參考1.63
1.81 maxWidth、maxHeight、minWidth、minHeight ，dialog可改變的最大寬度、最大高度、最小寬度、最小高度。maxWidth、maxHeight的默認(rèn)為false，為不限。minWidth、minHeight的默認(rèn)為150。要使用這些屬性需要ui.resizable.js 的支持。
1.82 初始化例：
$('.selector').dialog({ maxHeight: 400,maxWidth:600,minHeight:300,minWidth:300 });
1.83 初始化后，得到和設(shè)置：請(qǐng)參考1.63
1.91 hide、show ，當(dāng)dialog關(guān)閉和打開時(shí)候的效果。默認(rèn)為null，無(wú)效果
1.92 初始化例：最上面的實(shí)例中用到，請(qǐng)自己看吧。
1.93 初始化后，得到和設(shè)置：請(qǐng)參考1.63
1.101 modal,是否使用模式窗口，模式窗口打開后，頁(yè)面其他元素將不能點(diǎn)擊，直到關(guān)閉模式窗口。默認(rèn)為false不是模式窗口。
1.102 初始化例：$('.selector').dialog({ modal: true });
1.103 初始化后，得到和設(shè)置：請(qǐng)參考1.63
1.111 title，dialog的標(biāo)題文字，默認(rèn)為空。
1.112 初始化例：見最上面的實(shí)例。1.113 初始化后，得到和設(shè)置：請(qǐng)參考1.63
1.121 position ，dialog的顯示位置：可以是'center', 'left', 'right', 'top', 'bottom',也可以是top和left的偏移量也可以是一個(gè)字符串?dāng)?shù)組例如['right','top']。
1.122 初始化例：$('.selector').dialog({ position: ['top','right'] }); 1.123 初始化后，得到和設(shè)置：請(qǐng)參考1.63
1.131 zIndex, dialog的zindex值，默認(rèn)值為1000.
1.132 初始化例：$('.selector').dialog({ zIndex: 3999 }); 1.133 初始化后，得到和設(shè)置：請(qǐng)參考1.63
1.141 stack 默認(rèn)值為true，當(dāng)dialog獲得焦點(diǎn)是，dialog將在最上面。
1.142 初始化例：$('.selector').dialog({ stack: false }); 1.143 初始化后，得到和設(shè)置：請(qǐng)參考1.63
2 事件
2.11 beforeclose 類型dialogbeforeclose ， 當(dāng)dialog嘗試關(guān)閉的時(shí)候此事件將被觸發(fā)，如果返回false，那么關(guān)閉將被阻止。
2.12 初始化例：$('.selector').dialog({
?? beforeclose: function(event, ui) { ... }
});
2.13 使用類型綁定此事件例：$('.selector').bind('dialogbeforeclose', function(event, ui) {
...
});
2.21 close 類型：dialogclose ，當(dāng)dialog被關(guān)閉后觸發(fā)此事件。
2.22 初始化例：$('.selector').dialog({
?? close: function(event, ui) { ... }
});
2.23 使用類型綁定此事件例：$('.selector').bind('dialogclose', function(event, ui) {
...
});
2.3 open 類型：dialogopen ，當(dāng)dialog打開時(shí)觸發(fā)。（篇幅有限，該省略的就省略了啊，初始化例和使用類型綁定事件可以向上參考。）
2.4 focus 類型：dialogfocus ，當(dāng)dialog獲得焦點(diǎn)時(shí)觸發(fā)。
2.5 dragStart 類型：dragStart，當(dāng)dialog拖動(dòng)開始時(shí)觸發(fā)。
2.6 drag 類型：drag ，當(dāng)dialog被拖動(dòng)時(shí)觸發(fā)。
2.7 dragStop 類型：dragStop ，當(dāng)dialog拖動(dòng)完成時(shí)觸發(fā)。
2.8 resizeStart 類型：resizeStart ，當(dāng)dialog開始改變窗體大小時(shí)觸發(fā)。
2.9 resize 類型：resize，當(dāng)dialog被改變大小時(shí)觸發(fā)。
2.10 resizeStop 類型：resizeStop，當(dāng)改變完大小時(shí)觸發(fā)。
3 方法
3.1 destroy ，我喜歡這個(gè)哦，摧毀地球。。。 例：.dialog( 'destroy' )
3.2 disable，dialog不可用，例：.dialog('disable');
3.3 enable,dialog可用，例，如3.2
3.4 close，open，關(guān)閉、打開dialog
3.5 option ，設(shè)置和獲取dialog屬性，例如：.dialog( 'option' , optionName , [value] ) ，如果沒有value，將是獲取。
3.6 isOpen ，如果dialog打開則返回true，例如：.dialog('isOpen')
3.7 moveToTop ,將dialog移到最上層，例如：.dialog( 'moveToTop' )
jQuery UI accordion
1 選項(xiàng)：
1.1 active 這個(gè)參數(shù)是設(shè)置默認(rèn)選項(xiàng)的，默認(rèn)情況下是0，也就是第一個(gè)哦。哈哈。
初始化設(shè)置例：$('#accordion').accordion({ active: 2 });
在初始化之后的獲取和設(shè)置例：
//獲取 var active = $('#accordion').accordion('option', 'active'); //設(shè)置 $('#accordion').accordion('option', 'active', 2);
1.2 animated 這個(gè)參數(shù)是設(shè)置動(dòng)畫效果 默認(rèn)選項(xiàng)是‘slide’
可以設(shè)置你喜歡的動(dòng)畫效果，或不使用動(dòng)畫效果（設(shè)置false），除了默認(rèn)設(shè)置，使用'bounceslide'和'easeslide'需要UI Effects Core 。。。嘿嘿。。。
初始化設(shè)置例： $('#accordion').accordion({ animated: 'easeslide' });
在初始化之后的獲取和設(shè)置例：
//獲取
var animated = $('#accordion').accordion('option', 'animated');
//設(shè)置
$('#accordion').accordion('option', 'animated', 'easeslide');
1.3 autoHeight 默認(rèn)是true，如果設(shè)置，所有內(nèi)容部分的高被設(shè)定為其中最高內(nèi)容的高。 初始化設(shè)置：$('#accordion').accordion({ autoHeight: false })；
初始化以后的獲取或設(shè)置
//獲取
var autoHeight = $('#accordion').accordion('option', 'autoHeight');
//設(shè)置
$('#accordion').accordion('option', 'autoHeight', false);
1.4 clearStyle 默認(rèn)是false，似乎是清除style，哈哈~~~
初始化設(shè)置 $('#accordion').accordion({ clearStyle: true });
初始化后的獲取和設(shè)置和上面的差不多。。。省略。。。
1.5 event 默認(rèn)是'click' 如何展開選項(xiàng)?？梢栽O(shè)置長(zhǎng)雙擊、鼠標(biāo)滑過(guò)等。。。
初始化設(shè)置例：$('#accordion').accordion(event:"mouseover")；
初始化后的設(shè)置請(qǐng)參考上面的 ，此處省略。。。
1.6 fillSpace ，充滿父元素的高，默認(rèn)為false ，使用此項(xiàng),autoHeight無(wú)效。
初始化設(shè)置例：$('#accordion').accordion({ fillSpace: true });
初始化后的獲取和設(shè)置請(qǐng)參考上面的 ，此處省略。。。
1.7 header，設(shè)置頭元素（見上面實(shí)例)，默認(rèn)值為：'> li > :first-child,> :not(li):even'
此處省略，自己理解。。。
1.8 icon，設(shè)置小圖標(biāo)，默認(rèn)值為： { 'header': 'ui-icon-triangle-1-e', 'headerSelected': 'ui-icon-triangle-1-s' }
另外，請(qǐng)看下面的英國(guó)字兒~~~只可意會(huì)不可言傳。。。
Icons to use for headers. Icons may be specified for 'header' and 'headerSelected', and we recommend using the icons native to the jQuery UI CSS Framework manipulated byjQuery UI ThemeRoller
初始化設(shè)置例：$('#accordion').accordion({ icons: { 'header': 'ui-icon-plus', 'headerSelected': 'ui-icon-minus' } });
初始化后的獲取和設(shè)置省略。。。
1.9 navigation 和navigationFilter暫時(shí)不知道到底是做什么用的，回頭再說(shuō)吧。。。
2 事件
2.1 change事件 accordion改變時(shí)觸發(fā)的事件，有兩種綁定方法
第一種：
$('#accordion').bind('accordionchange', function(event, ui) {
ui.newHeader // jQuery 對(duì)象, 激活 header
ui.oldHeader // jQuery 對(duì)象, 之前 header
ui.newContent // jQuery 對(duì)象, 激活 content
ui.oldContent // jQuery 對(duì)象, 之前 content
});這種方法在前面的例子中已經(jīng)都有嘍~~
第二種：
$('#accordion').accordion({
?? change: function(event, ui) { ... }
}); 看清楚了吧。哈哈。
3 方法
3.1 destroy ：毀滅地球...
使用方法：.accordion( 'destroy' )
3.2 disable：accordion不可用，使之無(wú)效。
使用方法：.accordion('disable')
3.3 enable： 可用，使之有效，使用方法：略...
3.4 option：參數(shù)，使用方法：前面都已經(jīng)用過(guò)了，例：.accordion( 'option' , optionName ,[value])
3.5 activate：也是設(shè)置默認(rèn)選項(xiàng)，和參數(shù)active 作用一樣。例：.accordion( 'activate' , index )
轉(zhuǎn)載于:https://www.cnblogs.com/jason819/archive/2013/06/06/3120599.html
總結(jié)
以上是生活随笔為你收集整理的JQUERY插件学习之jQuery UI的全部?jī)?nèi)容，希望文章能夠幫你解決所遇到的問(wèn)題。
- 上一篇： mysql之mysqldump命令
- 下一篇： php 输出缓冲区清理