BUI

其它版本:

API for BUI 1.6.x

Show:

bui.accordion Class

折叠菜单

折叠菜单初始化时尽量使用ID单独初始化,它不止可以用于dl,dt 这样的结构,还可以用在panel以及自定义的结构中,更多例子参考modules/accordion_panel.html

预览地址: demo

方法说明:

show: 展开第几个
hide: 隐藏第几个
showFirst: 所有折叠菜单显示第一个
showAll: 所有折叠菜单全部展开
hideAll: 所有折叠菜单全部隐藏
option: 获取设置参数
widget: 获取依赖的控件
控件预览

Constructor

bui.accordion

(
  • option
)

Parameters:

  • option Object
    • id String

      控件id

    • [handle] String optional

      点击的区域

    • [height] Number optional

      父层高度,0则自适应

    • [target] String optional

      要显示隐藏的目标

    • [targetHeight] Number optional

      目标自适应高度还是限制高度

    • [single] Boolean optional

      false(显示多个) || true(一次只折叠一个)

    • [stopPropagation] Boolean optional

      1.5.6新增 默认:false不阻止冒泡, true 阻止冒泡,比方有链接的时候

    • [lock] Boolean optional

      1.5.6新增,锁定点击 默认:false可以点击 | true 不能点击

    • [onBeforeInit] Function optional

      1.5.1新增 初始化前触发

    • [onInited] Function optional

      1.5.1新增 初始化以后触发

    • [callback] Function optional

      点击按钮的回调

Example:

html:

   <dl id="accordion">
                                           <dt class="bui-btn">折叠菜单</dt>
                                           <dd>
                                               折叠菜单的内容
                                           </dd>
                                       </dl>
                                    

js:

       // 初始化
                                           var uiAccordion = bui.accordion({
                                               id: "#accordion"
                                             });
                                    
                                           // 展开第一个
                                           uiAccordion.showFirst();
                                    

Methods

destroy

(
  • [bool]
)

Defined in src/scripts/ui/bui.accordion.js:455

Available since 1.4.2

[销毁控件]

Parameters:

  • [bool] Boolean optional

    默认: false 销毁部分 | true 销毁全部

Example:

       //销毁
                                                       uiAccordion.destroy();
                                                

disabled

(
  • [index]
)
chainable

Defined in src/scripts/ui/bui.accordion.js:228

Available since 1.4

阻止触发

Parameters:

  • [index] Number optional

    阻止第几个,从0开始算起

Example:

       uiAccordion.disabled(1);
                                                

enabled

(
  • [index]
)
chainable

Defined in src/scripts/ui/bui.accordion.js:251

Available since 1.4

允许触发

Parameters:

  • [index] Number optional

    阻止第几个,从0开始算起

Example:

       uiAccordion.enabled(1);
                                                

hide

(
  • [index]
)
chainable

关闭第几个面板 这个需要绑定ID单独显示

Parameters:

  • [index] Number optional

    关闭第几个,从0开始算起

Example:

       //显示第几个
                                                       uiAccordion.hide(1);
                                                

hideAll

() chainable

隐藏所有展开的菜单

Example:

       //隐藏第几个
                                                       uiAccordion.hideAll();
                                                

init

(
  • [option]
)
chainable

初始化方法,用于重新初始化结构,事件只初始化一次

Parameters:

  • [option] Object optional

    参数控件本身

open

(
  • [option] []
  • [option.url] [ 文件路径,一般是通过getFile得到的路径]
  • [option.onSuccess] [成功的回调]
  • [option.onFail] [失败的回调]
)
chainable

Provided by the Native module.

Defined in src/scripts/mix/workplus/bui.native.file.js:509

本地程序打开文件

Parameters:

  • [option] [] Object optional
  • [option.url] [ 文件路径,一般是通过getFile得到的路径] String optional
  • [option.onSuccess] [成功的回调] Function optional
  • [option.onFail] [失败的回调] Function optional

Example:

       uiFile.open({
                                                           url: "file://",
                                                           onSuccess: function(url){
                                                               // 文件的地址
                                                               console.log(url)
                                                           }
                                                       })
                                                

option

(
  • [key]
  • [value]
)
chainable

获取设置参数

Parameters:

  • [key] String | object optional

    不传则获取所有参数, 类型为string,没有第2个参数则获取某个参数

  • [value] String | number | boolean | function optional

    设置参数的时候要传,设置多个参数不用传,获取参数的时候也不用传

Example:

       //获取所有参数
                                                       var option = uiAccordion.option();
                                                
                                                       //获取某个参数
                                                       var id = uiAccordion.option( "id" );
                                                
                                                       //修改一个参数
                                                       uiAccordion.option( "height",200 );
                                                
                                                       //修改多个参数
                                                       uiAccordion.option( {"height":200} );
                                                

show

(
  • [index]
)
chainable

显示第几个面板 这个需要绑定ID单独显示

Parameters:

  • [index] Number optional

    显示第几个,从0开始算起

Example:

       //显示第几个
                                                       uiAccordion.show(1);
                                                

showAll

() chainable

显示所有隐藏的菜单

Example:

       //显示第几个
                                                       uiAccordion.showAll();
                                                

showFirst

() chainable

所有折叠菜单显示第一个

Example:

       //显示第几个
                                                       uiAccordion.showFirst();
                                                

widget

(
  • [name] [ 依赖控件名 fileselect]
)

Provided by the Native module.

Defined in src/scripts/mix/workplus/bui.native.file.js:552

获取依赖的控件

Parameters:

  • [name] [ 依赖控件名 fileselect] String optional

Example:

       //获取依赖控件
                                                       var uiFileSelect = uiFile.widget("fileselect");
                                                       
                                                       //使用uifileselect的方法
                                                       uiFileSelect.add({
                                                           onSuccess: function(data){
                                                               console.log(data);
                                                           }
                                                       });
                                                

widget

(
  • [name]
)

获取依赖的控件

Parameters:

  • [name] String optional

    依赖控件名

Example:

       //获取依赖控件
                                                       var uiAccordionWidget = uiAccordion.widget();
                                                

Events

off

Defined in src/scripts/ui/bui.accordion.js:541

Available since 1.3.0

为控件取消绑定事件

Event Payload:

  • [type] String optional

    事件类型: "show"(显示目标时) | "hide"(隐藏目标时)

  • [callback] Function optional

    绑定的事件, this 为当前点击的菜单

Example:

       uiAccordion.off("show");
                                                

on

Defined in src/scripts/ui/bui.accordion.js:521

Available since 1.3.0

为控件绑定事件

Event Payload:

  • [type] String optional

    事件类型: "show"(显示目标时) | "hide"(隐藏目标时)

  • [callback] Function optional

    绑定的事件, this 为当前点击的菜单

Example:

       uiAccordion.on("show",function () {
                                                           // 点击的菜单
                                                           console.log(this);
                                                       });