<%@ page contentType="text/html; charset=UTF-8"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>alertifyjsDemo</title>
<!-- resource http://alertifyjs.com/guide.html -->
<!-- see http://alertifyjs.com/guide.html -->
<link rel="stylesheet" href="../component/alertifyjs/css/themes/bootstrap.min.css">
<link rel="stylesheet" href="../component/alertifyjs/css/alertify.css">
<link rel="stylesheet" href="http://maxcdn.bootstrapcdn.com/bootstrap/3.2.0/css/bootstrap.min.css">
<link rel="stylesheet" href="http://fonts.googleapis.com/css?family=Droid+Sans:400,700">
<script src="../component/alertifyjs/alertify.js"></script>
<script type="text/javascript" src="../component/jquery-1.11.1.js"></script>
<script type="text/javascript">
alertify.defaults.transition = "slide";
alertify.defaults.theme.ok = "btn btn-primary";
alertify.defaults.theme.cancel = "btn btn-danger";
alertify.defaults.theme.input = "form-control";
function interval(e){
alertify.dismissAll();
setCookie("a","c");
}
//设置cookie
function setCookie(name, value) {
var Days = 30;
var exp = new Date();
exp.setTime(exp.getTime() + Days*24*60*60*1000);
document.cookie = name + "="+ escape (value) + ";expires=" + exp.toGMTString();
}
function getCookie(name){
var arr,reg=new RegExp("(^| )"+name+"=([^;]*)(;|$)");
if(arr=document.cookie.match(reg))
return unescape(arr[2]);
else
return null;
}
$(function(){
$('#alert').click(function(){
alertify.alert('Bootstrap');
}); $('#confirm').click(function(){
alertify.confirm('Bootstrap');
}); $('#prompt').click(function(){
alertify.prompt('Bootstrap');
}); $("#notify").click(function() {
alertify.notify('sample', 'success', 5, function(){ console.log('dismissed'); });
}); $("#alert1").click(function() {
var closable = alertify.alert().setting('closable');
alertify.confirm('labels changed!')
.set('labels', {ok:'确定!', cancel:'取消!'})
.set('onok', function(closeEvent){ alertify.success('Ok');}); ;
}); $("#notify1").click(function() {
if(getCookie("a") != "c") {
var msg = alertify.message("<button onclick='interval(\"aaa\");'>不再显示</button>", 100, function(){ });
}
});
});
</script>
<style type="text/css">
body {
font-family:"Droid Sans","Helvetica Neue","Helvetica","Arial",sans-serif;
-webkit-overflow-scrolling: touch;
}
.btn{
margin: .25em;
}
</style>
</head>
<body>
----------基本功能-----------------
<div style="text-align:center;padding:40px;">
<a id="alert" class="btn btn-primary btn-lg">
Alert
</a> <a id="confirm" class="btn btn-primary btn-lg">
Confirm
</a> <a id="prompt" class="btn btn-primary btn-lg">
Prompt
</a> <a id="notify" class="btn btn-primary btn-lg">
Notify
</a>
</div>
<hr> <div style="text-align:center;padding:40px;">
<a id="alert1" class="btn btn-primary btn-lg">
alert1
</a> <a id="notify1" class="btn btn-primary btn-lg">
Notify1
</a>
</div> </body>
</html>

公司使用插件,随便封装一下非常好用,这里我们预想做一个不再显示的功能,修改了alertify.js里面的一个create函数function clickDelegate,屏蔽了点击消失的功能,然后把这个alert记录到Cookie中,以后读取cookie有值则不再显示,

 builder.append("window.ep.alert=function(msg,callback,cls){alertify.set({labels:{ok:'确定',cancel:'取消'},delay:2000,buttonReverse:true,buttonFocus:'ok'});alertify.alert(msg,callback,cls);};\n");
builder.append("window.ep.confirm=function(msg,callback,cls){alertify.set({labels:{ok:'确定',cancel:'取消'},delay:2000,buttonReverse:true,buttonFocus:'ok'});alertify.confirm(msg,callback,cls);};\n");
builder.append("window.ep.prompt=function(msg,defaultValue,callback,cls){alertify.set({labels:{ok:'确定',cancel:'取消'},delay:2000,buttonReverse:true,buttonFocus:'ok'});alertify.prompt(msg,function(e,str){callback.call(window, e?(!!str?str:''):null);},defaultValue,cls);};\n");
builder.append("window.ep.notify=function(msg,type,time){alertify.set({delay:2000});if(!time&&time!==0){time=2000;}if(type=='success'){alertify.success(msg,time);}else if(type=='error'){alertify.error(msg,time);}else{alertify.log(msg,type,time);}};\n");

alertifyjs的更多相关文章

  1. 2016年最好的15个Web设计和开发工具

    1.ai2html ai2html是适用于Adobe Illustrator的开源脚本,可以转换Illustrator文件为html和css. 官方网站:http://ai2html.org/ 2.A ...

  2. jQuery smartMenu右键自定义上下文菜单插件

    http://www.zhangxinxu.com/wordpress/?p=1667 <%@ page contentType="text/html; charset=UTF-8&q ...

  3. 前端组件库 - 搭建web app常用的样式/组件等收集列表(移动优先)

    0. 前端自动化(Workflow) 前端构建工具 Webpack - module bundler Yeoman - a set of tools for automating developmen ...

  4. IOS-2016年最好的15个Web设计和开发工具

    设计师和开发者,web设计师和开发者遍地开花.这促使web开发人员也需要寻找最好的工具去设计出优于其他人的网站.作为一个web设计师或开发者,你必须寻找新的途径来提高自己的技能,提高自己的工作质量.下 ...

随机推荐

  1. Union用法及说明:

    Union是用户合并多个select结果集的操作符,需要注意的是:select语句需要有相同的列数,类似的数据类型,且列的顺序相同,另外,UNION 结果集中的列名总是等于 UNION 中第一个 SE ...

  2. ThinkPHP模板IF标签用法详解

    投稿:shichen2014 字体:[增加 减小] 类型:转载 时间:2014-07-01 我要评论 这篇文章主要介绍了ThinkPHP模板IF标签用法,需要的朋友可以参考下 ThinkPHP的IF标 ...

  3. 利用PHPExcel导出Excel并设置Excel格式以及数据源

    浏览:23969 发布日期:2013/07/24 分类:技术分享 代码有点长,读起来有点累.先来个截图 导出的Excel太宽了,所以将后面的列宽重新调整了再截的图 功能包括: 1.设置单元格格式,包括 ...

  4. protobuf 原理

    Protobuf 的优点 Protobuf 有如 XML,不过它更小.更快.也更简单.你可以定义自己的数据结构,然后使用代码生成器生成的代码来读写这个数据结构.你甚至可以在无需重新部署程序的情况下更新 ...

  5. PostgresSQL中的限制和级联删除

    摘录自:http://www.mamicode.com/info-detail-879792.html 删除和更新时对应的操作是一样的

  6. 2018/1/28 每日一学 单源最短路的SPFA算法以及其他三大最短路算法比较总结

    刚刚AC的pj普及组第四题就是一种单源最短路. 我们知道当一个图存在负权边时像Dijkstra等算法便无法实现: 而Bellman-Ford算法的复杂度又过高O(V*E),SPFA算法便派上用场了. ...

  7. junit--eclipse插件

    现在比较火的IDE是JIDE,但是我一直在使用eclipse.对eclipse比较熟悉了,也有了感情了.这里就以eclipse为例,来整理下eclipse中junit插件的使用. 添加junit包到自 ...

  8. MOOC网视频下载并视频倍速播放,超简单哒,亲测可用,( •̀ ω •́ )y

    由于视频在线播放太卡,想着下载看吧~~可是这个坑爹的网站没有下载按钮,难道就不可以下载视频了吗? 小白不甘心~ 于是动手查了一下,实验很成功,估计如果会爬虫的都不用像我一样一个一个自己去下了,奈何我知 ...

  9. 【转】GAMITBLOBK中固定解、浮点解、约束解、松弛解等解类型解释

    在GAMIT/GLOBK的使用过程中,经常会碰到固定解.浮点解.约束解.松弛解及其相关组合解(如约束固定解)等词汇,对于初学者,一时难以弄明白其中的含义,一般只有按部就班按照教程中,怎么说就怎么弄,不 ...

  10. 手把手 学习Git

    一:Git是什么? Git是目前世界上最先进的分布式版本控制系统. 二:SVN与Git的最主要的区别? SVN是集中式版本控制系统,版本库是集中放在中央服务器的,而干活的时候,用的都是自己的电脑,所以 ...