个人觉得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. loj #107. 维护全序集

    #107. 维护全序集 题目描述 这是一道模板题,其数据比「普通平衡树」更强. 如未特别说明,以下所有数据均为整数. 维护一个多重集 S SS ,初始为空,有以下几种操作: 把 x xx 加入 S S ...

  2. Linux里的用户管理

    在linux中系统中,它并不认识帐号名称.它认识的是我们的帐号ID,帐号ID保存在/etc/passwd文件中.我们在登录linux主机时,在输入完帐号和密码时,linux会先查找/etc/passw ...

  3. Python元类__prepare__方法深入理解

    学习元类的时候,对__prepare__不是很理解,书上讲解的也不是很详细,最后通过查看stackoverflow的一些帖子对该方法有了一些理解,记录如下: 先看代码: class member_ta ...

  4. SDUT OJ 顺序表应用2:多余元素删除之建表算法

    顺序表应用2:多余元素删除之建表算法 Time Limit: 3 ms Memory Limit: 600 KiB Submit Statistic Discuss Problem Descripti ...

  5. 【离散数学】 SDUT OJ 传递闭包 && memset 使用注意事项

    传递闭包 Time Limit: 1000 ms Memory Limit: 65536 KiB Submit Statistic Problem Description 已知有n头牛,m次战斗关系, ...

  6. 19年PDYZ冬令营游记

    我和卓越的那些事 ——2019年平度一中卓越计划冬令营   题前记: 正月十三那天,刚看完<流浪地球>,便接到了一个电话,老妈告诉我竟然一中组织了一个冬令营,并且起了一个很好的名字“卓越计 ...

  7. 【算法笔记】B1005 继续(3n+1)猜想+sort()用法

    1005 继续(3n+1)猜想 (25 分) 卡拉兹(Callatz)猜想已经在1001中给出了描述.在这个题目里,情况稍微有些复杂. 当我们验证卡拉兹猜想的时候,为了避免重复计算,可以记录下递推过程 ...

  8. linux 配置环境变量

    配置全局 环境变量 查看环境变量 #这个变量赋值操作,只是临时生效,需要写入到文件,永久生效 echo $PATH/usr/local/sbin:/usr/local/bin:/usr/sbin:/u ...

  9. [转] 使用 Java8 Optional 的正确姿势

    [From] https://unmi.cc/proper-ways-of-using-java8-optional/ 我们知道 Java 8 增加了一些很有用的 API, 其中一个就是 Option ...

  10. 【研究】curl测试不安全的HTTP请求

    漏洞名称: 启用了不安全的HTTP方法 安全风险:       可能会在Web 服务器上上载.修改或删除Web 页面.脚本和文件. 可能原因:       Web 服务器或应用程序服务器是以不安全的方 ...