首页 教程 API文档

消息框组件

2015-10-15 10:05:42

属性


父模块 widget
Demo地址 MessageBox

描述


MessageBox组件是一个消息框组件,可以根据参数选项配置成任意形式的消息框,普通消息框,模态消息框,信息输入框等.

消息框组件图片

消息框组件图片

消息框组件图片

消息框组件图片

消息框组件图片

成员列表


方法名称 成员类型 描述
title public 消息框标题文字
text public 消息框内容文字
timeout public 消息框超时时间
updateLayout public 更新消息框布局
icon public 消息框图标
iconClass public 消息框图标类名
value public 消息框输入框值
informativeText public 消息框提示信息
inputType public 消息框的输入框类型
buttons public 消息框按钮设置
defaultButton public 消息框默认按钮
detailedText public 消息框细节文本
closable public 消息框是否可以被关闭
draggable public 消息框是否可被拖动

参数选项


名称 类型 默认值 描述
defaultClass String StdUI_MessageBox 默认class名称
renderTo String,Object "body" MessageBox默认要渲染到的目标位置,该位置可以是一个DOM元素或者DOM元素的css选择器
type String "information"

消息框的类型,可以有以下取值

名称 描述
information 信息提示框
warning 警告
error 错误提示框
question 问题提示框
acceptEsc Boolean true 当消息框弹出的时候,是否接受ESC键进行关闭
closable Boolean true 消息框是否可以被手动关闭
draggable Boolean true 消息框是否可以被拖动
title String null 标题默认文字,如果为null,那么标题就为type选项的文字
value Any null value值,当消息框拥有编辑框的时候,该值会应用到编辑框内
icon String "auto" 消息框的提示图标的地址,默认为根据type类型自动设置
iconClass String "auto" 消息框的提示图标的css class名称,默认为根据type类型自动设置
text String "null" 消息框文本内容
timeout Number 0 消息框渲染后多少秒后关闭,如果为0,则不进行自动关闭
buttons String "ok" 消息框底部默认的按钮,通常为 ok cancel close yes no abort retry ignore disagree apply
buttonsAlign String "right" 按钮对齐方式,默认居右对齐
inputType String null inputType为输入框的UI组件类型,例如input,SpinBox等,默认为null,表示消息框中不需要输入框
inputWidth Number "auto" 输入框宽度,默认为自动
inputHeight Number "auto" 输入框的高度,默认为自动
detailedText String Empty String 消息框的细节文本,如果该选项为空或者空文本,则不会出现细节文本
defaultButton String ok 消息框默认的焦点按钮名称,buttons中的一个
informativeText String null 重点提示文本,默认为null,表示不出现重点提示文本

事件


名称 回调参数 描述
buttonClick 按钮的名称,例如ok ,cancel 当消息框的按钮被点击时候,会触发这个事件,事件的参数为点击的这个按钮的名称

另外:当这些名称的按钮被点击的时候,对应名称的事件也会被触发

ok cancel close yes no abort retry ignore disagree apply

相关例子


弹出一个普通的消息框


Std.ui("MessageBox",{
    type:"success",
    text:"success"
});
        

弹出一个警告框


Std.ui("MessageBox",{
    type:"warning",
    text:"warning",
    buttons:"yes no cancel",
    defaultButton:"cancel"
});
        

弹出一个带有输入框的消息框


Std.ui("MessageBox",{
    title:"abc",
    text:"line text:",
    value:"aaaaaaaa",
    inputType:"LineEdit",
    on:{
        ok:function(){
            console.log(this.value());
        }
    }
});