artDialog提示框、对话框
/**
* 警告
* @param {String}消息内容
*/
artDialog.alert = function (content, callback) {
return artDialog({
id: 'Alert',
icon: 'warning',
fixed: true,
// lock: true,
width:250,
height:50,
content: content,
ok: true,
close: callback
});
};
/**
* 确认
* @param {String}消息内容
* @param {Function}确定button回调函数
* @param {Function}取消button回调函数
*/
artDialog.confirm = function (content, yes, no) {
return artDialog({
id: 'Confirm',
icon: 'question',
fixed: true,
// lock: true,
opacity: .1,
width:250,
height:50,
content: content,
ok: function (here) {
return yes.call(this, here);
},
cancel: function (here) {
return no && no.call(this, here);
}
});
};
/**
* 提问
* @param {String}提问内容
* @param {Function}回调函数. 接收參数:输入值
* @param {String}默认值
*/
artDialog.prompt = function (content, yes, value) {
value = value || '';
var input; return artDialog({
id: 'Prompt',
icon: 'question',
fixed: true,
// lock: true,
width:250,
height:50,
opacity: .1,
content: [
'<div style="margin-bottom:5px;font-size:12px">',
content,
'</div>',
'<div>',
'<input value="',
value,
'" style="width:18em;padding:6px 4px" />',
'</div>'
].join(''),
init: function () {
input = this.DOM.content.find('input')[0];
input.select();
input.focus();
},
ok: function (here) {
return yes && yes.call(this, input.value, here);
},
cancel: true
});
};
/**
* 短暂提示
* @param {String}提示内容
* @param {Number}显示时间 (默认1.5秒)
*/
artDialog.tips = function (content, time) {
return artDialog({
id: 'Tips',
title: false,
cancel: false,
fixed: true,
// lock: true,
width:250,
height:50
})
.content('<div style="padding: 0 1em;">' + content + '</div>')
.time(time || 1);
};
//右下角滑动通知
artDialog.notice = function (options) {
var opt = options || {},
api, aConfig, hide, wrap, top,
duration = 800; var config = {
id: 'Notice',
left: '100%',
top: '100%',
fixed: true,
drag: false,
width:250,
height:50,
resize: false,
follow: null,
lock: false,
init: function(here){
api = this;
aConfig = api.config;
wrap = api.DOM.wrap;
top = parseInt(wrap[0].style.top);
hide = top + wrap[0].offsetHeight; wrap.css('top', hide + 'px')
.animate({top: top + 'px'}, duration, function () {
opt.init && opt.init.call(api, here);
});
},
close: function(here){
wrap.animate({top: hide + 'px'}, duration, function () {
opt.close && opt.close.call(this, here);
aConfig.close = $.noop;
api.close();
}); return false;
}
}; for (var i in opt) {
if (config[i] === undefined) config[i] = opt[i];
}; return artDialog(config);
};
//调用范例:
art.dialog.alert('人品越来越不那么稳定了,请检查!'); art.dialog.confirm('你确定要删除这掉消息吗?', function () {
art.dialog.tips('运行确定操作');
}, function () {
art.dialog.tips('运行取消操作');
}); art.dialog.prompt('请输入图片网址', function (val) {
art.dialog.tips(val);
}, 'http://'); art.dialog.tips('数据正在提交..', 2);
//[more code..]
art.dialog.tips('成功。已经保存在server');
artDialog提示框、对话框的更多相关文章
- artDialog提示框
API网址 http://aui.github.io/artDialog/doc/index.html 相关资料下载 https://code.google.com/archive/p/artdial ...
- 如何在 messager/alert/confirm等消息提示框中 获取 / 设置 嵌入 html内容中的 input[type=checkbox]等的选中状态?
总结, 有3点: 不能/不要 在 这些消息框 / 提示框/ 对话框中的 回调函数中去写代码: 获取嵌入 内容中input.checkbox的选中状态, 因为 虽然在这些框存在的时候, 这个 check ...
- js弹出框、对话框、提示框、弹窗总结
一.JS的三种最常见的对话框 //====================== JS最常用三种弹出对话框 ======================== //弹出对话框并输出一段提示信息 funct ...
- 基于Metronic的Bootstrap开发框架经验总结(6)--对话框及提示框的处理和优化
在各种Web开发过程中,对话框和提示框的处理是很常见的一种界面处理技术,用得好,可以给用户很好的页面体验,Bootstrap开发也一样,我们往往在页面新增.编辑.查看详细等界面使用弹出对话框层的方式进 ...
- jquery仿alert提示框、confirm确认对话框、prompt带输入的提示框插件[附实例演示]
jquery仿alert提示框.confirm确认对话框.prompt带输入的提示框插件实例演示 第一步:引入所需要的jquery插件文件: http://www.angelweb.cn/Inc/eg ...
- form WebBrowser自动点击弹出提示框alert、弹出对话框confirm、屏蔽弹出框、屏蔽弹出脚本错误的解决办法
针对WebBrowser控件中自动点击弹出框及禁用脚本提示问题得到如下几种实际情况的解决办法,绝对管用. 1.屏蔽弹出错误脚本 将WebBrowser控件ScriptErrorsSuppressed设 ...
- Android开发 ---构建对话框Builder对象,消息提示框、列表对话框、单选提示框、多选提示框、日期/时间对话框、进度条对话框、自定义对话框、投影
效果图: 1.activity_main.xml 描述: a.定义了一个消息提示框按钮 点击按钮弹出消息 b.定义了一个选择城市的输入框 点击按钮选择城市 c.定义了一个单选提示框按钮 点击按钮选择某 ...
- 经验总结:WebBrowser自动点击弹出提示框alert、弹出对话框confirm、屏蔽弹出框、屏蔽弹出脚本错误的解决办法
经验总结:WebBrowser自动点击弹出提示框alert.弹出对话框confirm.屏蔽弹出框.屏蔽弹出脚本错误的解决办法 网上有好多解决方法,可是不一定好使,本人经过多次试验,针对WebBrows ...
- bootstrap dialog对话框,完成操作提示框
1. 依赖文件: bootstrap.js bootstrap-dialog.js bootstrap.css bootstrap-dialog.css 2.代码 BootstrapDialog.co ...
随机推荐
- CF402E Strictly Positive Matrix(矩阵,强联通分量)
题意 给定一个 n∗n 的矩阵 A,每个元素都非负判断是否存在一个整数 k 使得 A^k 的所有元素 >0 n≤2000(矩阵中[i][i]保证为1) 题解 考虑矩阵$A*A$的意义 ,设得到的 ...
- caioj 1079 动态规划入门(非常规DP3:钓鱼)(动规中的坑)
这道题写了我好久, 交上去90分,就是死活AC不了 后来发现我写的程序有根本性的错误,90分只是数据弱 #include<cstdio> #include<algorithm> ...
- CodeForces 383C Propagating tree
Propagating tree Time Limit: 2000ms Memory Limit: 262144KB This problem will be judged on CodeForces ...
- centos7 安装rsyslog
http://blog.csdn.net/u011630575/article/details/50896781 http://blog.chinaunix.net/uid-21142030-id-5 ...
- ArcGIS api for javascript——合并两个ArcGIS Online服务
描述 这个示例创建一个地图并ArcGIS Online增加连个图层到地图.ArcGIS Online是由ESRI体提供的一组切片地图服务,可以用来通过高质量的地图和数据增强应用.这个示例增加影像和运输 ...
- 【Android进阶】Junit单元測试环境搭建以及简单有用
单元測试的目的 首先.Junit单元測试要实现的功能,就是用来測试写好的方法是否可以正确的运行,一般多用于对业务方法的測试. 单元測试的环境配置 1.在AndroidManifest清单文件的Appl ...
- 基于请求响应的MVC框架调用分析
一.使用Servlet来处理请求响应 当client提交数据之后.接着发送请求,请求被封装成对象,server接收到请求,依据请求的URL.来推断将请求对象交由哪个Servlet处理. 在servle ...
- CSS3 实现RSS图标
<html xmlns="http://www.w3.org/1999/xhtml"> <head> <title>CSS3 实现RSS图标&l ...
- 存储过程和transaction
https://stackoverflow.com/questions/11531352/how-to-rollback-a-transaction-in-a-stored-procedure BEG ...
- BZOJ 3236 莫队+树状数组
思路: 莫队+树状数组 (据说此题卡常数) yzy写了一天(偷笑) 复杂度有点儿爆炸 O(msqrt(n)logn) //By SiriusRen #include <cmath> #in ...