artDialog组件应用学习(一)
个人觉得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组件应用学习(一)的更多相关文章
- artDialog组件应用学习(五)
一.artDialog事件应用 对话框编写代码 function DialogEvent() { seajs.use(['jquery', '/Scripts/arale/artDialog/src/ ...
- artDialog组件应用学习(四)
一.在对话框自定义操作按钮 预览: html调用代码: var btnArray = [ { value: '同意', callback: function () { this.content('你同 ...
- artDialog组件应用学习(三)
一.可以加载url的对话框 预览: 对话框编写代码 //弹出一个对话框,加载页面 function OpenBox(url, title, width, height) { seajs.use(['j ...
- artDialog组件应用学习(二)
一.没有操作选项的对话框 预览: html前台引入代码:(之后各种效果对话框引入代码致,调用方法也一样,就不一一写入) <script type="text/javascript&qu ...
- DocX开源WORD操作组件的学习系列四
DocX学习系列 DocX开源WORD操作组件的学习系列一 : http://www.cnblogs.com/zhaojiedi1992/p/zhaojiedi_sharp_001_docx1.htm ...
- DocX开源WORD操作组件的学习系列三
DocX学习系列 DocX开源WORD操作组件的学习系列一 : http://www.cnblogs.com/zhaojiedi1992/p/zhaojiedi_sharp_001_docx1.htm ...
- DocX开源WORD操作组件的学习系列二
DocX学习系列 DocX开源WORD操作组件的学习系列一 : http://www.cnblogs.com/zhaojiedi1992/p/zhaojiedi_sharp_001_docx1.htm ...
- DocX开源WORD操作组件的学习系列一
DocX学习系列 DocX开源WORD操作组件的学习系列一 : http://www.cnblogs.com/zhaojiedi1992/p/zhaojiedi_sharp_001_docx1.htm ...
- Vue学习—组件的学习
1.什么是组件? 组件(Component)是 Vue.js 最强大的功能之一.组件可以扩展 HTML 元素,封装可重用的代码.在较高层面上,组件是自定义元素, Vue.js 的编译器为它添加特殊功能 ...
随机推荐
- golang并发练习代码笔记
golang语言的精髓就是它的并发机制,十分简单,并且极少数在语言层面实现并发机制的语言,golang被成为网络时代的c语言,golang的缔造者也有c语言的缔造者,Go语言是google 推出的一门 ...
- Eclipse内存不足 增加eclipse的运行内存
自己解决的 三. 修改Run Configurations (此方法可行) 在代码上右键,依次点击“Run As ”-> “Run Configurations ”,在Arguments ...
- memcached 和 redis 安装
memcached 1.搭建好lnmp 2.安装依赖包 yum install -y libevent-devel 3.安装memcached $ cd /usr/local/src $ wget h ...
- application的使用(实现计数器)
application在整个WEB项目中共享使用数据. 常用方法: getAttribute(); setAttribute();示列: <% Object count=applicati ...
- SDUT OJ 顺序表应用3:元素位置互换之移位算法
顺序表应用3:元素位置互换之移位算法 Time Limit: 1000 ms Memory Limit: 570 KiB Submit Statistic Discuss Problem Descri ...
- 使用vue-cli脚手架搭建项目,保存编译时出现的代码检查错误(ESLint)
一.问题 出现这么写错误是什么原因呢?相信很多小白都会像我一样,第一次接触时有点二丈和尚摸不着头脑.其实是在你用vue-cli脚手架构建项目时用了ESLint代码检查工具,如下图 那么什么是ESLin ...
- 一款给力的一键复制js插件-clipboard.js
一款没有依赖的.给力的一键复制的JS插件 点我前往github 案例demo见下载包内demo文件夹. 这里晒出最常用的几种方式,以供不时之需. <!DOCTYPE html> < ...
- XAF对Attribute的总结
[Aggregated] 没有参数,作用于a property or a field,并且只能是持久类的引用或者XPCollection.实现两个持久类的级联删除的功能. [Association(& ...
- redis中使用lua脚本
lua脚本 Lua是一个高效的轻量级脚本语言,用标准C语言编写并以源代码形式开放, 其设计目的是为了嵌入应用程序中,从而为应用程序提供灵活的扩展和定制功能 使用脚本的好处 1.减少网络开销,在Lua脚 ...
- mac 配置charles
从官网下载链接http://www.charlesproxy.com/download 附上注册码: Registered Name: https://zhile.io License Key: 48 ...