jqueryeasyui詳細說明文檔1

/孫本強2010-11-09

目錄diveasyui-window window窗口樣式 3diveasyui-panel 面板 3aeasyui-linkbutton 鏈接類型的按鈕 4input/textareaeasyui-validatebox 字段驗證 4uleasyui-tree 樹形結(jié)構(gòu) 5tableeasyui-datagrid 表格 5diveasyui-tabs tab容器 7divmenu-sep 菜單分隔線 8aeasyui-splitbutton 菜單列 8diveasyui-accordion 手風(fēng)琴式下拉框 8selecteasyui-combobox 組合下拉框 8selecteasyui-combotree 組合樹形框 8body[div]easyui-layout 布局 9diveasyui-menu 菜單 9aeasyui-menubutton 菜單按鈕 9inputeasyui-numberbox 數(shù)字輸入框 9window window窗口 10.tree 樹形結(jié)構(gòu) 10.datagrid 表格 10.combobox 組合下拉框 10.combotree 組合樹形框 10.dialog 對話框 10.draggable 可自由拖動的塊 10.linkbutton 鏈式按鈕 10.messager 消息框 10.pagination 頁碼工具條 11

CSS類定義：diveasyui-window window窗口樣式屬性如下：modal:是否生成模態(tài)窗口。true[是]false[否]shadow:是否顯示窗口陰影。true[顯示]false[不顯示]diveasyui-panel 面板屬性如下：title:該標題文本顯示在面板頭部。iconCls:在面板上通過一個CSS類顯示16x16圖標。width:設(shè)置面板寬度。默認auto。height:設(shè)置面板高度。默認auto。left:設(shè)置面板左邊距。top:設(shè)置面板頂部位置。cls:在面板中增加一個Class類。headerCls:在面板頭部中增加一個Class類。bodyCls:在面板內(nèi)容中增加一個Class類。style:在面板中增加一個指定樣式。fit:當(dāng)True時設(shè)置該面板尺寸適合于它的父容器。默認false。border:當(dāng)定義時顯示面板邊界。默認true。doSize:如果設(shè)置為True，該面板將重繪大小，并重建布局。默認true。collapsible:當(dāng)定義時顯示可折疊面板的按鈕。默認false。minimizable:當(dāng)定義時顯示最小化面板的按鈕。默認false。maximizable:當(dāng)定義時顯示最大化面板的按鈕。默認false。closable:當(dāng)定義時顯示關(guān)閉面板的按鈕。默認false。tools:自定義工具欄，每個工具都包含兩個屬性:iconCls、handler。collapsed:當(dāng)定義時該面板初始化時處于收縮狀態(tài)。默認false。minimized:當(dāng)定義時該面板初始化時處于最小化狀態(tài)。默認false。maximized:當(dāng)定義時該面板初始化時處于最大化狀態(tài)。默認false。closed：當(dāng)定義時該面板初始化時處于關(guān)閉狀態(tài)。默認false。href:一個url，加載遠程數(shù)據(jù)并顯示在面板中。loadingMessage:當(dāng)加載遠程數(shù)據(jù)時，在面板中顯示一個消息。默認Loading…事件如下:onLoad:當(dāng)遠程數(shù)據(jù)加載完畢后激活。onBeforeOpen:當(dāng)面板打開前激活。onOpen:當(dāng)面板打開后激活。onBeforeClose:當(dāng)面板關(guān)閉前激活。onClose:當(dāng)面板關(guān)閉后激活。onBeforeDestroy:當(dāng)面板銷毀前激活。onDestroy:當(dāng)面板銷毀后激活。onBeforeCollpase:當(dāng)面板收縮前激活。onCollapse:當(dāng)面板收縮后激活。onBeforeExpand:當(dāng)面板擴展前激活。onExpand:當(dāng)面板擴展后激活。onResize:當(dāng)面板重繪后激活。width:新建的外部寬度height:新建的外部高度onMove:當(dāng)面板移動后激活。left:左側(cè)新位置。top:頂部新位置。onMaximize:當(dāng)窗口最大化后激活。onRestore:當(dāng)窗口恢復(fù)到原來大小時激活。onMinimize:當(dāng)窗口最小化后激活。方法如下：options:返回options屬性。panel:返回面板對象。header:返回面板頭部對象。body:返回面板主體對象。setTitle:設(shè)置頭部的標題文本。open:當(dāng)forceOpen參數(shù)設(shè)置為true時，面板打開時繞過onBeforeOpen回調(diào)函數(shù)。close:當(dāng)forceClose參數(shù)設(shè)置為true時，該面板關(guān)閉時繞過onBeforeClose回調(diào)函數(shù)。destroy:當(dāng)forceDestroy參數(shù)設(shè)置為true時該面板銷毀時繞過onBeforeDestroy回調(diào)函數(shù)。refresh:當(dāng)href屬性設(shè)置后刷新該面板以加載遠程數(shù)據(jù)。resize:設(shè)置面板的大小和布局。該options對象包含以下屬性:width：新的面板寬度。height：新的面板高度。left：新的面板左側(cè)位置。top：新的面板頂部位置。move:移動面板到一個新的位置。該options對象包含以下屬性：left：新的面板左側(cè)位置。top：新的面板頂部位置。aeasyui-linkbutton 鏈接類型的按鈕屬性如下：disabled:當(dāng)True時禁用該按鈕。默認false。plain:當(dāng)True時顯示一個普通效果。默認false。input/textareaeasyui-validatebox 字段驗證屬性如下：required:true[必需]false[不必需]默認falsevalidType:a、length[a,b] 字段長度控制在a至b之間。b、email 驗證Email。c、url 驗證網(wǎng)絡(luò)地址。missingMessage：當(dāng)文本時出現(xiàn)空時彈出該工具提示，系統(tǒng)有默認[英文]，自定義可覆蓋它。invalidMessage：當(dāng)文本內(nèi)容無效后彈出該工具提示，系統(tǒng)有默認[英文]，自定義可覆蓋它。uleasyui-tree 樹形結(jié)構(gòu)屬性如下：url:一個獲取遠程數(shù)據(jù)的地址。animate:當(dāng)展開或折疊節(jié)點時是否定義動畫效果。true[是]false[否]默認false節(jié)點屬性如下：text:節(jié)點的顯示文本。id:節(jié)點ID，對于加載遠程數(shù)據(jù)時非常重要。state:節(jié)點狀態(tài)，'open'或'closed'，默認為'open'。當(dāng)設(shè)置為'關(guān)閉'，該節(jié)點包含子節(jié)點，并attributes:為節(jié)點添加自定義屬性。children:以數(shù)組節(jié)點的方式定義一些字節(jié)點。事件如下：onClick:當(dāng)用戶點擊一個節(jié)點時激活，該節(jié)點參數(shù)包含如下屬性：id：節(jié)點IDtext:節(jié)點文本attributes:節(jié)點自定義屬性。target:目標點擊的DOM對象。onLoadSuccess:當(dāng)數(shù)據(jù)成功加載數(shù)據(jù)時激活，該參數(shù)跟jQuery.ajax的'success'函數(shù)效果相同。onLoadError:當(dāng)數(shù)據(jù)加載數(shù)據(jù)失敗時激活，該參數(shù)跟jQuery.ajax的'error'函數(shù)效果相同。方法如下:reload:重新加載樹數(shù)據(jù)。getSelected:獲取選中的節(jié)點并返回它，如果沒有選擇節(jié)點將返回null。collapse:折疊一個節(jié)點，該目標參數(shù)是該節(jié)點的DOM對象。expand:展開一個節(jié)點，該目標參數(shù)是該節(jié)點的DOM對象。append:在一個父節(jié)點追加一些子節(jié)點。param有兩個屬性：parent:DOM對象，把它作為父節(jié)點追加(它們)。data:array，或者節(jié)點數(shù)據(jù)。remove:刪除它以與它以下的子節(jié)點，該目標參數(shù)是該節(jié)點的DOM對象。tableeasyui-datagrid 表格屬性如下：title:該DataGrid面板的標題文本。iconCls:一個CSS類，將提供一個背景圖片作為標題圖標。border：當(dāng)true時，顯示該datagrid面板的邊框。width:面板寬度，自動列寬。height:面板高度，自動列高。columns:該DataGrid列配置對象，查看column屬性可獲取更多信息。frozenColumns:跟Columns屬性相同，但是這些列將會被固定在左邊。striped:當(dāng)true時，單元格顯示條紋。默認false。method:通過該方法類型請求遠程數(shù)據(jù)。默認post。nowrap:當(dāng)true時，顯示數(shù)據(jù)在同一行上。默認true。idField:說明哪個字段是一個標識字段。url:一個URL，從遠程站點獲取數(shù)據(jù)。loadMsg:當(dāng)從遠程站點加載數(shù)據(jù)時，顯示一個提示信息。默認"Processing,pleasewait…"。自定義覆蓋。pagination:當(dāng)true時在DataGrid底部顯示一個分頁工具欄。默認false。rownumbers:當(dāng)true時顯示行號。默認false。singleSelect:當(dāng)true時只允許當(dāng)前選擇一行。默認false。fit:當(dāng)true時，設(shè)置大小以適應(yīng)它的父容器。默認false。pageNumber:當(dāng)設(shè)置分頁屬性時，初始化的頁碼編號。默認從1開始)pageSize:當(dāng)設(shè)置分頁屬性是，初始化的頁面大小。默認10行pageList:當(dāng)設(shè)置分頁屬性時，初始化頁面的大小選擇清單。默認[10,20,30,40,50]queryParams:當(dāng)請求遠程數(shù)據(jù)時，也可以發(fā)送額外的參數(shù)。sortName:定義哪列可以排序。sortOrder:定義列的排列順序，只能是'asc'或'desc'。默認asc。Column屬性如下：title:該列標題文本。field:該列對應(yīng)的字段名稱。width：列寬。rowspan:說明該單元格需要多少行數(shù)。colspan:說明該單元格需要多少列數(shù)。align:說明Column數(shù)據(jù)的對齊方式。'left'，'right'，'center'都可以使用。sortable:當(dāng)true時，允許該列進行排序。checkbox:當(dāng)true時，允許該列出現(xiàn)checkbox。事件如下：onLoadSuccess:當(dāng)遠程數(shù)據(jù)加載成功是激活。onLoadError:當(dāng)遠程數(shù)據(jù)加載發(fā)現(xiàn)一些錯誤時激活。onClickRow:當(dāng)用戶點擊某行時激活，參數(shù)包含：rowIndex:點擊的行索引，從0開始。rowData:點擊行時對應(yīng)的記錄。onDblClickRow:當(dāng)用戶雙擊某行時激活，參數(shù)包含：rowIndex:點擊的行索引，從0開始。rowData:點擊行時對應(yīng)的記錄。onSortColumn:當(dāng)用戶對某列排序時激活，參數(shù)包含：sort:排序字段名稱。order:排序字段類型。onSelect:當(dāng)用戶選擇某行時激活，參數(shù)包含:rowIndex:點擊的行索引，從0開始。rowData:點擊行時對應(yīng)的記錄。onUnselect:當(dāng)用戶取消選擇某行時激活，參數(shù)包含:rowIndex:點擊的行索引，從0開始。rowData:點擊行時對應(yīng)的記錄。方法如下：options:返回選擇對象。resize:重調(diào)大小，生成布局。reload:重新加載數(shù)據(jù)。fixColumnSize:固定列大小。loadData:加載本地數(shù)據(jù)，過去的行會被刪除。getSelected:返回第一個選中行的記錄，若未選返回null。getSelections:返回選中的所有行，當(dāng)沒有選擇記錄時將返回空數(shù)組。clearSelections:清除所有選項的選擇狀態(tài)。selectRow:選擇一行，行索引從0開始。selectRecord:通過傳遞一個ID值參數(shù)，選擇一行。unselectRow:取消選擇一行。diveasyui-tabs tab容器屬性如下：width:容器寬度，自動列寬。height:容器高度，自動列高。idSeed:該根id衍生成標簽面板DOMid屬性。默認0plain：當(dāng)true時，該Tab渲染不使用容器背景圖片。默認falsefit:當(dāng)true時，設(shè)置該Tab大小以適應(yīng)它的父容器。默認falseborder:當(dāng)true時，顯示該Tab邊框。scrollIncrement:scrollDuration:事件如下：onLoad:當(dāng)一個ajaxTab面板需要加載遠程數(shù)據(jù)時激活。該參數(shù)跟jQuery.ajax的'success'函數(shù)效果相同。onSelect:當(dāng)用戶選擇一個Tab面板時激活。onClose:當(dāng)用戶關(guān)閉一個Tab面板時激活。方法如下:resize:重繪該Tab容器的布局。add:新增加一個Tab面板，該選項參數(shù)是一個配置對象，看Tab面板屬性可獲取更多信息。close：關(guān)閉該Tab面板，標題參數(shù)顯示你要關(guān)閉的對象。select:選擇一個Tab面板。exists:如果該Tab面板存在即顯示。Tab面板屬性如下：id:該Tab面板DOMid屬性。text:該Tab面板標題文本。content:該Tab面板內(nèi)容。href:一個URL，加載遠程內(nèi)容以填充Tab面板。cache:當(dāng)true時，緩存Tab面板，當(dāng)href屬性設(shè)置后有效。默認trueicon:增加一個CSSclass圖標以顯示在Tab面板的標題旁。closable:當(dāng)true時，該Tab面板將顯示可關(guān)閉按鈕，點擊能關(guān)閉該Tab面板。默認falseselected:當(dāng)true時，該Tab面板將被選中。默認falsewidth:面板寬度，自動列寬。height:面板高度，自動列高。divmenu-sep 菜單分隔線aeasyui-splitbutton 菜單列diveasyui-accordion 手風(fēng)琴式下拉框繼承自panelselecteasyui-combobox 組合下拉框?qū)傩匀缦拢簑idth:容器寬度，自動列寬。listWidth:該組合下拉框的寬度。listHeight:該組合下拉框的高度。valueField：把該基礎(chǔ)數(shù)據(jù)的值名稱綁定到組合下拉框中[value]。textField:把該基礎(chǔ)數(shù)據(jù)的字段名稱綁定到組合下拉框中[text]。editable:當(dāng)True時，可直接在文字域中鍵入文本。默認true。url:一個URL，從遠程加載列表數(shù)據(jù)。事件如下：onLoadSuccess:當(dāng)遠程數(shù)據(jù)加載成功是激活。onLoadError:當(dāng)遠程數(shù)據(jù)加載發(fā)現(xiàn)一些錯誤時激活。onSelect:當(dāng)用戶選擇一個列表選項時激活。onChange:當(dāng)該字段的值發(fā)生改變時激活。方法如下:select:在下拉列表中選擇一個值。setValue:設(shè)置指定值到該字段。在'param'參數(shù)可以是一個字符串或者一個JS對象。注:JS對象包含的屬性對應(yīng)valueField和TextField兩個屬性。getValue:獲取該字段的值。reload:重新請求遠程列表數(shù)據(jù)。selecteasyui-combotree 組合樹形框?qū)傩匀缦拢簑idth:容器寬度，自動列寬。treeWidth:該樹形下拉框的寬度。treeHeight:該樹形下拉框的高度。url:一個URL，從遠程加載樹形數(shù)據(jù)。事件如下：onSelect:當(dāng)用戶選擇一個樹形節(jié)點時激活。onChange:當(dāng)該字段的值發(fā)生改變時激活。方法如下:setValue:設(shè)置指定值到該字段。在'param'參數(shù)可以是一個樹形節(jié)點ID值或者一個JS對象。注:JS對象包含的屬性對應(yīng)id和text兩個屬性。getValue:獲取該字段的值。reload:重新請求遠程列表數(shù)據(jù)。body[div]easyui-layout 布局屬性如下：title:該面板標題文本。region:定義布局面板的位置，包含下列值:north,south,east,west,center。border:當(dāng)True時顯示布局面板的邊框。默認為True。split:當(dāng)True時顯示一個分割符以使用戶改變面板的尺寸。默認false。icon:一個圖標CSS類，在面板頭部顯示一個圖標。href:一個URL,以從遠程站點加載數(shù)據(jù)。diveasyui-menu 菜單屬性如下：zIndex:Menuz-index樣式。注釋：z-index屬性設(shè)置元素的堆疊順序。left:菜單左起位置。默認0。top:菜單頂部位置。默認0。href:當(dāng)點擊菜單項時能在當(dāng)前瀏覽器窗口顯示不同的網(wǎng)址。事件如下:onShow:激活后顯示菜單。onHide:激活后隱藏菜單。方法如下:show:在指定的位置顯示一個菜單。該位置上包含兩個參數(shù)：left:新的左起位置。top:新的頂部位置。hide:隱藏一個菜單。aeasyui-menubutton 菜單按鈕屬性如下：disabled:當(dāng)True時禁用該按鈕。默認false。plain:當(dāng)True時顯示一個普通效果。默認false。menu:一個選擇器名稱，用來創(chuàng)建相應(yīng)的菜單。duration:當(dāng)懸停該按鈕時，定義菜單的持續(xù)顯示時間，單位為毫秒。默認inputeasyui-numberbox 數(shù)字輸入框選項如下:min:允許的最小值。當(dāng)輸入值小于最小值時，顯示最小值。max:允許的最大值。當(dāng)輸入值大于最大值時，顯示最大值。precision:分隔符后能精確的小數(shù)點位數(shù)。整數(shù)默認會追加小數(shù)點位數(shù)。JS定義：window window窗口.tree 樹形結(jié)構(gòu).datagrid 表格.combobox 組合下拉框.combotree 組合樹形框.dialog 對話框繼承自window私有屬性如下：title:該對話框標題文本。默認"NewDialog"。collapsible:當(dāng)True時可顯示折疊按鈕。默認false。minimizable:當(dāng)True時可顯示最小化按鈕。默認false。maximizable:當(dāng)True時可顯示最大化按鈕。默認false。resizable:當(dāng)True時能重繪對話框大小。默認false。toolbar:該工具欄置于對話框的頂部，每個工具欄包含:text,iconCls,disabled,handler等屬性。buttons:這個按鈕置于對話框的底部，每個按鈕包含:text,iconCls,handler等屬性。.draggable 可自由拖動的塊屬性如下:handle:選擇"#id"進行拖動。disabled:當(dāng)True時停止自由拖動。默認false。edge:開始拖動拖動塊時的寬度。默認0。axis:當(dāng)拖動塊移動時定義軸，可選值是'v'或者'h',當(dāng)超出'v'和'h'的方位時將設(shè)置為null。事件如下：onStartDrag:當(dāng)目標對象開始拖動時激活。onDrag:在拖動期間激活。返回false將不會實際拖動它(的位置)。onStopDrag:當(dāng)目標對象停止拖動時激活。.linkbutton 鏈式按鈕.messager 消息框選項如下：ok:顯示確定按鈕文本。cancel:顯示取消按鈕文本。方法如下show:在屏幕的右下角出現(xiàn)一個消息框。該選項參數(shù)是一個配置對象，它包括：showType:定義消息框顯示的模式，可選值包括:null,slide,fad