• artDialog配置参数


    artDialog配置参数

     
    名称类型默认值描述
    内容
    title String '消息' 标题内容
    content String 'loading..' 消息内容。
    1、如果传入的是HTMLElement类型,如果是隐藏元素会给其设置display:block以显示该元素,其他属性与绑定的事件都会完整保留,对话框关闭后此元素又将恢复原来的display属性,并且重新插入原文档所在位置
    2、如果没有设定content的值则会有loading的动画
    HTMLElement
    按钮
    ok Function null 确定按钮回调函数。
    函数如果返回false将阻止对话框关闭;函数this指针指向内部api;如果传入true表示只显示有关闭功能的按钮
    Boolean
    cancel Function null 取消按钮回调函数。
    函数如果返回false将阻止对话框关闭;函数this指针指向内部api;如果传入true表示只显示有关闭功能的按钮
    对话框标题栏的关闭按钮其实就是取消按钮,只不过视觉不同罢了,点击同样触发cancel事件
    Boolean
    okVal String '确定' "确定按钮"文字
    cancelVal String '取消' "取消按钮"文字
    button Array null 自定义按钮。
    配置参数成员:
    name —— 按钮名称
    callback —— 按下后执行的函数
    focus —— 是否聚焦点
    disabled —— 是否标记按钮为不可用状态(后续可使用扩展方法让其恢复可用状态)

    示例:
    参数如:[{name: '登录', callback: function () {}}, {name: '取消'}] 。注意点击按钮默认会触发按钮关闭动作,需要阻止触发关闭请让回调函数返回false
    尺寸
    width Number 'auto' 设置消息内容宽度,可以带单位。一般不需要设置此,对话框框架会自己适应内容。
    如果设置为百分值单位,将会以根据浏览器可视范围作为基准,此时如果浏览器窗口大小被改变其也会进行相应的调整
    String
    height Number 'auto' 设置消息内容高度,可以带单位。不建议设置此,而应该让内容自己撑开高度。
    如果设置为百分值单位,将会以根据浏览器可视范围作为基准,此时如果浏览器窗口大小被改变其也会进行相应的调整
    String
    位置
    fixed Boolean false 开启静止定位。静止定位是css2.1的一个属性,它静止在浏览器某个地方不动,也不受滚动条拖动影响。(artDialog支持IE6 fixed)
    follow HTMLElement null 让对话框依附在指定元素附近。
    可传入元素ID名称,注意ID名称需要以“#”号作为前缀
    String
    left Number '50%' 相对于可视区域的X轴的坐标。
    可以使用'0%' ~ '100%'作为相对坐标,如果浏览器窗口大小被改变其也会进行相应的调整
    String
    top Number '38.2%' 相对于可视区域的Y轴的坐标。
    可以使用'0%' ~ '100%'作为相对坐标,如果浏览器窗口大小被改变其也会进行相应的调整
    String
    视觉
    lock Boolean false 开启锁屏。
    中断用户对话框之外的交互,用于显示非常重要的操作/消息,所以不建议频繁使用它,它会让操作变得繁琐
    background String '#000' 锁屏遮罩颜色
    opacity Number 0.7 锁屏遮罩透明度
    icon String null 定义消息图标。可定义“skins/icons/”目录下的图标名作为参数名(不包含后缀名)
    padding String '20px 25px' 内容与边界填充边距(即css padding)
    交互
    time Number null 设置对话框显示时间。以秒为单位
    resize Boolean true 是否允许用户调节尺寸
    drag Boolean true 是否允许用户拖动位置
    esc Boolean true 是否允许用户按Esc键关闭对话框
    高级
    id String null 设定对话框唯一标识。用途:
    1、防止重复弹出
    2、定义id后可以使用art.dialog.list[youID]获取扩展方法
    Number
    zIndex Number 1987 重置全局zIndex初始值。
    用来改变对话框叠加高度。比如有时候配合外部浮动层UI组件,但是它们可能默认zIndex没有artDialog高,导致无法浮动到artDialog之上,这个时候你就可以给对话框指定一个较小的zIndex值。
    请注意这是一个会影响到全局的配置,后续出现的对话框叠加高度将重新按此累加。
    init Function null 对话框弹出后执行的函数
    close Function null 对话框关闭前执行的函数。函数如果返回false将阻止对话框关闭。
    请注意这不是关闭按钮的回调函数,无论何种方式关闭对话框,close都将执行。
    show Boolean true 是否显示对话框

    扩展方法

    名称描述
    close() 关闭对话框
    show() 显示对话框
    hide() 隐藏对话框
    title(value) 写入标题。无参数则返回标题容器元素
    content(value) 向消息容器中写入内容。参数支持字符串、DOM对象,无参数则返回内容容器元素
    button(arguments) 插入一个自定义按钮。
    配置参数成员:
    name —— 按钮名称
    callback —— 按下后执行的函数
    focus —— 是否聚焦点
    disabled —— 是否标记按钮为不可用状态(后续可使用扩展方法让其恢复可用状态)

    示例:
    button({
        name: '登录',
        focus: true,
        callback: function () {}
    }, {
        name: '取消'
    })
    follow(element) 让对话框吸附到指定元素附近
    position(left, top) 重新定位对话框
    size(width, height) 重新设定对话框大小
    lock() 锁屏
    unlock() 解锁
    time(val) 定时关闭(单位秒)
  • 相关阅读:
    javaScript学习日记 1 数组
    总结css中单位px和em,rem的区别
    读书摘要
    读书摘要
    各种官方网站汇集
    js相关参考资料
    Node相关参考资料
    Angular【学习笔记】
    Node连接MySQL
    em 和 px相互转换
  • 原文地址:https://www.cnblogs.com/mjtabu/p/12711055.html
Copyright © 2020-2023  润新知