个人觉得artDialog是一组很不错的对话框组件。写的是artDialog_v6应用。

官方称其兼容性测试通过:IE6~IE11、Chrome、Firefox、Safari、Opera。

官网:http://aui.github.io/artDialog/

一.artDialog特点:

1.支持普通和气泡形式对话框;

2.支持标准和模态对话框;

3.自适应内容尺寸;

4.可以自定义皮肤。

二.网页中使用artDialog需要seajs或RequireJS加载。我用的是seajs。

从官网可以下载artDialog相关组件和seajs。

应用实例:1.在自己的专案里引入artDialog相关文件;

2.在网页中引入seajs;

 <script type="text/javascript" src="/Scripts/Arale/sea-modules/sea.js"></script>
<script type="text/javascript">
seajs.config({
alias: {
"jquery": "jquery-1.10.2"
}
});
</script>

三.属性与方法

  • 方法

    • show([anchor])
    • showModal([anchor])
    • close([result])
    • remove()
    • content(html)
    • title(text)
    • width([value])
    • height([value])
    • reset()
    • button(args)
    • focus()
    • blur()
    • addEventListener(type, callback)
    • removeEventListener(type, callback)
    • dialog.get(id)
    • dialog.getCurrent()
  • 选项
    • 内容

      • title
      • content
      • statusbar
    • 按钮
      • ok
      • okValue
      • cancel
      • cancelValue
      • button
    • 外观
      • width
      • height
      • skin
      • padding
      • align
    • 交互
      • fixed
      • quickClose
      • autofocus
      • zIndex
    • 事件
      • onshow
      • onbeforeremove
      • onremove
      • onclose
      • onfocus
      • onblur
      • onreset
    • 高级
      • id
  • 属性
    • open
    • returnValue

以上属性和方法在各种对话框中基本通用,可自行试用。

artDialog组件应用学习(一)的更多相关文章

  1. artDialog组件应用学习(五)

    一.artDialog事件应用 对话框编写代码 function DialogEvent() { seajs.use(['jquery', '/Scripts/arale/artDialog/src/ ...

  2. artDialog组件应用学习(四)

    一.在对话框自定义操作按钮 预览: html调用代码: var btnArray = [ { value: '同意', callback: function () { this.content('你同 ...

  3. artDialog组件应用学习(三)

    一.可以加载url的对话框 预览: 对话框编写代码 //弹出一个对话框,加载页面 function OpenBox(url, title, width, height) { seajs.use(['j ...

  4. artDialog组件应用学习(二)

    一.没有操作选项的对话框 预览: html前台引入代码:(之后各种效果对话框引入代码致,调用方法也一样,就不一一写入) <script type="text/javascript&qu ...

  5. DocX开源WORD操作组件的学习系列四

    DocX学习系列 DocX开源WORD操作组件的学习系列一 : http://www.cnblogs.com/zhaojiedi1992/p/zhaojiedi_sharp_001_docx1.htm ...

  6. DocX开源WORD操作组件的学习系列三

    DocX学习系列 DocX开源WORD操作组件的学习系列一 : http://www.cnblogs.com/zhaojiedi1992/p/zhaojiedi_sharp_001_docx1.htm ...

  7. DocX开源WORD操作组件的学习系列二

    DocX学习系列 DocX开源WORD操作组件的学习系列一 : http://www.cnblogs.com/zhaojiedi1992/p/zhaojiedi_sharp_001_docx1.htm ...

  8. DocX开源WORD操作组件的学习系列一

    DocX学习系列 DocX开源WORD操作组件的学习系列一 : http://www.cnblogs.com/zhaojiedi1992/p/zhaojiedi_sharp_001_docx1.htm ...

  9. Vue学习—组件的学习

    1.什么是组件? 组件(Component)是 Vue.js 最强大的功能之一.组件可以扩展 HTML 元素,封装可重用的代码.在较高层面上,组件是自定义元素, Vue.js 的编译器为它添加特殊功能 ...

随机推荐

  1. LoadRunner11_录制脚本时的浏览器版本

    最近在做的项目,因为浏览器类型及版本问题,浪费了很多时间,现在就此次的小折腾做一个小结,方便后期录制时选择(如果自己写脚本,那就可以完全忽略这些啦): (1)IE:win7   32位LR11.0,最 ...

  2. Python变量类型的强制转换

    当我们需要对数据的类型转换时,只需要将数据类型作为函数名即可. 下面给出的函数可以执行数据类型之间的转换,函数返回一个新的对象,表示转换的值 函数格式 使用示例 描述 int(x [,base]) i ...

  3. (转)2-SAT小结

    2-sat小结 原文作者:老K 原文传送门 2-sat是什么 一类问题是这样的: (两个符号的意思 \(\lor \ or,\land \ and\)) 有n个布尔变量,现在对它们做出限制,比如\(a ...

  4. js 事件的阶段

    事件有三个阶段: 1.事件捕获阶段 :从外向内 2.事件目标阶段 :最开始选择的那个 3.事件冒泡阶段 : 从里向外   为元素绑定事件 addEventListener("没有on的事件类 ...

  5. 安装使用Redis过程中可能出现的错误收集

    1.使用make test测试编译状态报错 cd src && make test make[1]: Entering directory `/usr/local/redis-3.2. ...

  6. 【转】idea新建项目文件名为红色的解决办法

    idea如果当前project用了版本控制器,其下面新建的所有的项目默认都是加入到版本控制里面,所以项目名称和文件都是红色的. 解决办法: ctrl + alt + s 进入设置界面,–>ver ...

  7. python get() 和getattr()

    get() Python 字典 get() 函数返回指定键的值,如果值不在字典中返回默认值. 语法: dict.get(key, default=None) 实例1: d={'A':1,'b':2} ...

  8. 51Nod-1259-整数划分 V2

    51Nod-1259-整数划分 V2 将N分为若干个整数的和,有多少种不同的划分方式,例如:n = 4,{4} {1,3} {2,2} {1,1,2} {1,1,1,1},共5种.由于数据较大,输出M ...

  9. vim大法

    $Linux vi/vim编辑器常用命令与用法总结 (一)vi/vim是什么?Linux世界几乎所有的配置文件都是以纯文本形式存在的,而在所有的Linux发行版系统上都有vi编辑器,因此利用简单的文字 ...

  10. 微信获取用户信息的两个接口和两个ACCESS_TOKEN

    有一段时间没有搞微信开发了 ,今天突然要改一下程序! 回头一看 微信的帮助文档太tm的稀烂的,太难懂了,这做个笔记以后看着方便 微信有2个ACCESS_TOKEN, 1,基础接口的token 获取接口 ...