jQuery+easy+UI+APIWord格式.docx

1、）.tabs（options）;To add a tab panel:）.tabs（add, title:New Tab, content:Tab Body closable:true）;DependenciesnoneOptionsTabs ContainerOverride defaults with $.fn.tabs.defaults.PropertiesNameTypeDescriptionDefaultwidthnumberThe width of tabs container.autoheightThe height of tabs container.idSeedThe bas

2、e id seed to generate tab panels DOM id attribute.plainbooleanTrue to render the tab strip without a background container image.falsefitTrue to set the size of tabs container to fit its parent container.borderTrue to show tabs container border.scrollIncrementThe number of pixels to scroll each time

3、a tab scroll button is pressed.100scrollDurationThe number of milliseconds that each scroll animation should last.400EventsParametersonLoadargumentsFires when an ajax tab panel finish loading remote data. arguments is same as the callback funtion success of jQuery.ajax.onSelecttitleFires when user s

4、elect a tab panel.onCloseFires when user close a tab panel.MethodsParameterresizeResize the tabs container and do layout.addoptionsAdd a new tab panel, the options parameter is a config object, see tab panel properties for more details.closeClose a tab panel, title parameter indicate which panel to

5、be closed.selectSelect a tab panel.existsIndicate if the special panel is exists.Tab PanelidstringThe tab panel DOM id attribute.nullThe tab panel title text.contentThe tab panel content.hrefA URL to load remote content to fill the tab panel.cacheTrue to cache the tab panel, valid when href property

6、 is setted.iconAn icon CSS class to show on tab panel title.closableWhen set to true, the tab panel will show a closable button which can click to close the tab panel.selectedWhen set to true, tab tab panel will be selected.The width of tab panel.The height of tab panel.Usage Draggabledd100px;border

7、:1px solid #ccc;titlebackground:#ccc;title#dd）.draggable（options）;Override defaults with $.fn.draggable.defaults.handleselectorThe handle that start the draggable.disabledTrue to stop draggable.edgeThe drag width in which can start draggable.axisDefines the axis which the dragged elements moves on,

8、available value is v or h, when set to null will move across and direction.onStartDrageFires when the target object start dragging.onDragFires during dragging. Return false will not do dragging actually.onStopDragFires when the dragging stops.Resizable Usage Resizablerr#rr）.resizable（options）;Overri

9、de defaults with $.fn.resizable.defaults.True to disable resizing.handlesIndicate the direction of resizable,n is the north,e is the east,etc.n, e, s, w, ne, se, sw, nw, allminWidthThe minimum width when resizing.10minHeightThe minimum height when resizing.maxWidthThe maximum width when resizing.100

10、00maxHeightThe maximum height when resizing.The edge of border to be resized.5onStartResizeFires when start resizing.onResizeFires during resizing. When return false, the DOM element will not acts actual resize action.onStopResizeFirest when stop resizing.Panel Usage PanelMany panel properties can b

11、e defined in markup.p title=My Panel collapsible=10px; Panel ContentTo create a panel#p）.panel（options）;To create a panel with custom tools）.panel（ My Panel tools: iconCls:icon-new handler:function（）alert（new） ,icon-savesave To move panel to other position）.panel（move left:100, top:Override defaults

12、 with $.fn.panel.defaults.The title text to display in panel header.iconClsA CSS class to display a 16x16 icon in panel.Set the panel width.Set the panel height.leftSet the panel left position.topSet the panel top position.clsAdd a CSS class to the panel.headerClsAdd a CSS class to the panel header.

13、bodyClsAdd a CSS class to the panel body.styleobjectAdd a custom specification style to the panel.When true to set the panel size fit itDefines if to show panel border.doSizeIf set to true,the panel will be resize and do layout when created.collapsibleDefines if to show collapsible button.minimizabl

14、eDefines if to show minimizable button.maximizableDefines if to show maximizable button.Defines if to show closable button.toolsarrayCustom tools, every tool can contain two properties: iconCls and handlercollapsedDefines if the panel is collapsed at initialization.minimizedDefines if the panel is m

15、inimized at initialization.maximizedDefines if the panel is maximized at initialization.closedDefines if the panel is closed at initialization.A URL to load remote data and then display in the panel.loadingMessageWhen loading remote data show a message in the panel.LoadingFires when remote data is l

16、oaded.onBeforeOpenFires before panel is opened.onOpenFires after panel is opened.onBeforeCloseFires before panel is closed.Fires after panel is closed.onBeforeDestroyFires before panel is destroyed.onDestroyFires after panel is destroyed.onBeforeCollpaseFires before panel is collapsed.onCollapseFire

17、s after panel is collpased.onBeforeExpandFires before panel is expanded.onExpandFires after panel is expanded.width, heightFires after panel is resized. the new outer width the new outer heightonMoveleft,topFires after panel is moved.left: the new left postiontop: the new top positiononMaximizeFires

18、 after the window has been maximized.onRestoreFires after the window has been restored to its original size.onMinimizeFires after the window has been minimized.Return options property.panelReturn the panel object.headerReturn the panel header object.bodyReturn the panel body object.setTitleSet the t

19、itle text of header.openforceOpenWhen forceOpen parameter set to true, the panel is opened bypass the onBeforeOpen callback.forceCloseWhen forceClose parameter set to true, the panel is closed bypass the onBeforeClose callback.destroyforceDestroyWhen forceDestroy parameter set to true, the panel is

20、destroyed bypass the onBeforeDestroy callback.refreshRefresh the panel to load remote data when href property is setted.Set panel size and do layout. The options object contains following properties: the new panel width the new panel height the new panel left position the new panel top positionmoveM

21、ove the panel to a new position. The options object contains following properties:Accordion Usage Accordionaa300px;200px;Title1icon-saveh3 style=color:#0099FF;Accordion for jQuerypAccordion is a part of easyui framework for jQuery. It lets you define your accordion component on web page more easily.Title2 selected= content2Title3 content3#aa）.accordion（options）; panel Container OptionsThe width of accordion container.The height of accordion container.Set to true to set the accordion container size fit itDefines if to show the border.Panel OptionsThe accordion panel o