BUI

其它版本:

API for BUI 1.6.x

Show:

bui.hint Class

Module: UI

自动消失提示框

默认从底部弹出,4秒后消失,可以自行修改,也可以改成手动关闭的方式.

预览地址: demo

方法说明:

hide: 隐藏
show: 显示
isShow: 当前状态
remove: 移除
option: 获取设置参数
widget: 获取依赖控件
控件预览

Constructor

bui.hint

(
  • [option]
)

Parameters:

  • [option] Object optional
    • appendTo String

      [ 在某个容器内 例如:#page ]

    • width Number | String

      [ 1.5.4新增, 宽度, 默认: 0, 支持百分比 ]

    • height Number

      [ 1.5.4新增, 高度, 默认: 0, 高度不支持百分比 ]

    • content String

      [ 提醒的内容,没有内容只是引用,不执行 ]

    • skin String

      [ 1.5.0新增, 默认:"" | warning | primary | success | danger ]

    • effect String

      [ 动画效果,参考toggle ]

    • timeout Number

      [ 多少秒后消失 单位:ms ]

    • autoTrigger Boolean

      [ 1.5.5新增, 是否自动触发显示默认true | false ]

    • autoClose Boolean

      [ 是否自动关闭 默认true | false ]

    • showClose Boolean

      [ 是否显示关闭图标 默认false | true ]

    • position String

      [ bottom | top ]

    • [onBeforeInit] [ 1.5.1新增 初始化前触发] Function optional
    • [onInited] [ 1.5.1新增 初始化以后触发] Function optional
    • onClose Function

      [ 关闭的时候执行 ]

    • onHided Function

      [ 1.6.2 新增 关闭后执行 ]

Example:

   方法1: 快速提醒
                                       bui.hint("确定会删除信息,不可还原");
                                

方法2: 可以修改更多参数 bui.hint({ appendTo: "", content: "", timeout: 2000, autoClose: false, //不开启倒计时 position: "bottom", // bottom || top onClose: null }) 方法2: 居中提醒示例 bui.hint({ content:"
欢迎使用BUI", position:"center" , effect:"fadeInDown" });

Item Index

Events

Methods

destroy

(
  • [bool] [ 默认: false 销毁部分 | true 销毁全部]
)

[销毁控件]

Parameters:

  • [bool] [ 默认: false 销毁部分 | true 销毁全部] Boolean optional

Example:

       //销毁
                                                   uiHint.destroy();
                                            

hide

(
  • text
)
chainable

隐藏提醒

Parameters:

  • text String

    [提醒的文本]

Example:

       var uiHint = bui.hint({ "content": "提醒的信息", "autoClose": true});
                                            
                                                       //如果一直存在,就需要手动关闭了
                                                       uiHint.hide();
                                            

init

(
  • [option] [参数控件本身]
)
chainable

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

Parameters:

  • [option] [参数控件本身] Object optional

isShow

() chainable

当前的显示状态

Example:

       var uiHint = bui.hint("提醒的信息");
                                                       uiHint.isShow();
                                            

option

(
  • [key] [ 不传则获取所有参数, 类型为string,没有第2个参数则获取某个参数]
  • [value] [ 设置参数的时候要传,设置多个参数不用传,获取参数的时候也不用传]
)
chainable

获取设置参数

Parameters:

  • [key] [ 不传则获取所有参数, 类型为string,没有第2个参数则获取某个参数] String | object optional
  • [value] [ 设置参数的时候要传,设置多个参数不用传,获取参数的时候也不用传] String | number | boolean | function optional

Example:

       //获取所有参数
                                                    //获取所有参数
                                                   var option = uiHint.option();
                                            
                                                   //获取某个参数
                                                   var id = uiHint.option( "appendTo" );
                                            
                                                   //修改一个参数
                                                   uiHint.option( "autoClose",true );
                                            
                                                   //修改多个参数
                                                   uiHint.option( {"autoClose":true} );
                                            

remove

(
  • text
)
chainable

新增提醒

Parameters:

  • text String

    [提醒的文本]

Example:

       var uiHint = bui.hint("提醒的信息");
                                                       uiHint.remove();
                                            

show

(
  • text
)
chainable

显示提醒

Parameters:

  • text String

    [提醒的文本]

Example:

       var uiHint = bui.hint({ "content": "提醒的信息", "autoClose": true});
                                            
                                                       //如果一直存在,就需要手动关闭了
                                                       uiHint.show();
                                            

text

(
  • val
)
chainable

Defined in src/scripts/ui/bui.hint.js:460

Available since 1.5.5

修改文本

Parameters:

  • val String

    [修改的文本]

Example:

      //修改文本
                                                  uiHint.text("1321");
                                            

widget

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

Defined in src/scripts/ui/bui.hint.js:417

Available since 1.4.2

获取依赖的控件

Parameters:

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

Example:

       //获取依赖控件
                                                   var uiHintWidget = uiHint.widget();
                                            

Events

off

Defined in src/scripts/ui/bui.hint.js:497

Available since 1.3.0

为控件取消绑定事件

Event Payload:

  • [type] [ 事件类型: "show" | "hide"(隐藏或者移除时)] String optional
  • [callback] [ 绑定的事件, this 为当前点击的菜单] Function optional

Example:

       uiHint.off("show");
                                            

on

Defined in src/scripts/ui/bui.hint.js:477

Available since 1.3.0

为控件绑定事件

Event Payload:

  • [type] [ 事件类型: "show" | "hide"(隐藏或者移除时)] String optional
  • [callback] [ 绑定的事件, this 为当前点击的菜单] Function optional

Example:

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