自定义alert和confirm
var common = {};
common.showAlert = function (msg) {
var html = "<div id='dialog_alert' class=\"eject dialog_alert\" style=\"display:block;z-index:9999999999;\">";
html+="<div class=\"web-feedback w400\">";
html+="<div class=\"eject-ly\">";
html+="<div class=\"eject-ly-lef fl\">";
html+="<span class=\"fl\"><img src=\"images/ckwls_03.jpg\"></span>";
html+="<span class=\"fl eject-ckl\">提示</span>";
html+="<span class=\"fl\"><img src=\"images/ckwls_05.jpg\"></span>";
html+="</div>";
html += "<div class=\"fr eject-lyr\" onclick='common.hideAlert()'>";
html+="<img src=\"images/close.jpg\">";
html+="</div>";
html+="</div>";
html+="<div class=\"upload-prompt\">";
html += msg;
html+="</div>";
html+="</div>";
html+="<div class=\"hiddenDiv\"> </div>";
html+="</div>";
$("body").append(html);
}
common.hideAlert = function () {
$(".dialog_alert").remove();
} common.showWarn = function (msg) {
var html = "<div id='dialog_warn' onclick='common.hideWarn()' class=\"eject dialog_warn\" style=\"display:block;z-index:9999999999;\">";
html += "<div class=\"web-feedback w400\">";
html += "<div class=\"eject-ly\">";
html += "<div class=\"eject-ly-lef fl\">";
html += "<span class=\"fl\"><img src=\"images/ckwls_03.jpg\"></span>";
html += "<span class=\"fl eject-ckl\">提示</span>";
html += "<span class=\"fl\"><img src=\"images/ckwls_05.jpg\"></span>";
html += "</div>";
html += "<div class=\"fr eject-lyr\" onclick='common.hideWarn()'>";
//html += "<img src=\"images/close.jpg\">";
html += "</div>";
html += "</div>";
html += "<div class=\"upload-prompt\">";
html += msg;
html += "</div>";
html += "</div>";
html += "<div class=\"hiddenDiv\"> </div>";
html += "</div>";
$("body").append(html);
$('#dialog_warn').fadeIn('slow');
}
common.hideWarn = function () {
$(".dialog_warn").fadeTo("slow", 0.01, function () {//fade
$(this).slideUp("slow", function () {//slide up
$(this).remove();//then remove from the DOM
});
});
} /*
*自定义confirm 调用方法common.showConfirm("确定***吗?",function(){alert('确定函数')},function(){alert('不确定函数')});
*/
common.showConfirm = function (msg, callback_ok,callback_cancel) {
var html = "<div class=\"eject dialog_confirm\" ng-show=\"confirmstate\" style=\"display:block;z-index:9999999999;\">";
html += "<div class=\"web-feedback w280\">";
html += "<div class=\"eject-ly\">";
html += "<div class=\"eject-ly-lef fl\">";
html += "<span class=\"fl\"><img src=\"images/ckwls_03.jpg\"></span>";
html += "<span class=\"fl eject-ckl\">确认</span>";
html += "<span class=\"fl\"><img src=\"images/ckwls_05.jpg\"></span>";
html += "</div>";
html += "<div class=\"fr eject-lyr\">";
html += "<img src=\"images/close.jpg\" onclick=\"common.hideConfirm()\">";
html += "</div>";
html += "</div>"; html += "<div class=\"alert-contet\" style=\"min-height:10px;\">";
html += msg;
html += "</div>"; html += "<div class=\"confirm-confirm\">";
html += "<a class=\"fl confirm-con\" id=\"confirm_ok\">确认</a>";
html += "<a class=\"fr confirm-esc\" id=\"confirm_cancel\">取消</a>";
html += "</div>"; html += "</div>";
html += "<div class=\"hiddenDiv\"> </div>";
html += "</div>";
$("body").append(html);
$("#confirm_ok").click(function () {
if (callback_ok && typeof callback_ok == "function")
callback_ok(true);
$(".dialog_confirm").remove();
});
$("#confirm_cancel").click(function () {
if (callback_cancel && typeof callback_cancel == "function")
callback_cancel(true);
$(".dialog_confirm").remove();
});
}
自定义alert和confirm的更多相关文章
- 利用bootstrap的modal组件自定义alert,confirm和modal对话框
由于浏览器提供的alert和confirm框体验不好,而且浏览器没有提供一个标准的以对话框的形式显示自定义HTML的弹框函数,所以很多项目都会自定义对话框组件.本篇文章介绍自己在项目中基于bootst ...
- 自定义alert,confirm,prompt事件,模仿window.alert(),confirm(),prompt()
css代码: /*custom_alert and custom_confirm*/ ; } ;;background-color: #585858; padding: 30px 30px; bord ...
- jquery自定义对话框alert、confirm和prompt
jQuery Alert Dialogs,又一个基于jQuery的提示框插件,主要包括Alert.Confirm.prompt这三种,还有一个高级范例,可以在提示框内嵌入HTML语言,可以自定义风格样 ...
- 【转】bootbox自定义dialog、confirm、alert样式,以及基本设置方法setDefaults中可用参数
<html> <head> <meta charset="utf-8"> <meta name="viewport" ...
- jQuery自定义alert,confirm方法及样式
学过JavaScript的都知道,alert().confirm()都是window对象特有的方法,而这两个方法我们平时使用的频率也很高,但是比较扎心的就是他自带的样式太... 因此,我整理了一个比较 ...
- 弹出框优化实例(alert和confirm)
在项目过程中会遇到需要使用自己定义的弹出框的情况.以前用过ymprompt,但是它太复杂而且不好自己操控.所以自己写了一个弹出框实例. 主要有两类弹出框alert和confirm.基于jQuery a ...
- 原生js实现自定义alert风格和实现
2018年6月29 最新更新 添加函数节流,解决多次点击问题,添加单例模式,提高代码性能. <!DOCTYPE html> <html lang="en"> ...
- 重构alert,confirm
最近写了一个重构的alert,confirm控件,调用时直接使用alert,confirm即可 //调用方法 alert("提示语") window.confirm('你确定要删除 ...
- Selenium2学习-040-JavaScript弹出框(alert、confirm、prompt)操作演示实例
弹出框是网页自动化测试常见得操作页面元素之一,常见的JavaScript弹出框有如下三种: 1.alert(message):方法用于显示带有一条指定消息和一个 OK 按钮的警告框.DemoAlert ...
随机推荐
- HTTP 错误 403.14 - Forbidden的解决办法
错误: HTTP 错误 403.14 - ForbiddenWeb 服务器被配置为不列出此目录的内容. 原因: 出现这个错误,是因为默认文档中没有增加index.aspx导致的. 解决方法: 打开 ...
- ACM网络镜像赛
参加了东大,南理的网络镜像赛,分别答对了两道题和三道题.感觉自己完全被虐了.发现了很多自己应该去掌握的知识,找到了自己的差距.容斥原理,博弈论,等等,这将是我努力的方向. 在跟大神同学和学姐交流的过程 ...
- c#发送http请求注意
这里要注意几个点:第一就是编码,如果编码不对,容易中文乱码第二就是ContentType 如果设置不对,有可能连方法都调试不进去(我api用的是MVC的普通controller)第三就是paramDa ...
- Java常用术语及区别
Java中总有几个术语,平时说的多,但是还是让人有点摸不着头脑,今天就来解析一下他们的区别: l JDK:Java development toolkit,是 Java 语言的软件开发工具包(SDK) ...
- 项目版本管理 github简介
git config user.email "c.wuliying@samsung.com"git config user.name "swportal" ** ...
- ACdream 1732
input 样例个数T <=10000 每个样例一个n(2<=n<=10^8) output lcm(1,2,...,n)%2^32 Sample Input 5 ...
- ES6 之 Set数据结构和Map数据结构 Iterator和for...of循环
ECMAScript 6 入门 Set数据结构 基本用法 ES6提供了新的数据结构Set.它类似于数组,但是成员的值都是唯一的,没有重复的值. Set本身是一个构造函数,用来生成Set数据结构. va ...
- 对“针对接口编程,而不是针对实现编程”的理解
今天在阅读<Head First设计模式>的时候,看到了这句话:"针对接口编程,而不是针对实现编程",第一次见到的时候,不太清楚作者想表达的意思,想着到后来看看实例就懂 ...
- tablespace
CREATE [UNDO] TABLESPACE tablespace_name [DATAFILE datefile_spec1 [,datefile_spec2] ...... [{MININUM ...
- python-cmp()的使用
注意:python3中已经删除了cmp()该函数. cmp(x,y) 比较x与y,当x>y时,返回1: 当x==y时,返回0: 当x<y时,返回-1: >>>cmp(1, ...