jquery封装的对话框简单实现


Posted in Javascript onJuly 21, 2013
var _alert_iconCss = "tipmsg_icoInfo"; 
var _confirm_iconCss = "tipmsg_icoConfirm"; 
var _error_iconCss = "tipmsg_icoError"; 
var _warning_iconCss = "tipmsg_icoWarning"; 
function dialogInit(type, msg) { 
var iconCss = ""; 
switch (type) { 
case "confirm" : iconCss = _confirm_iconCss; break; 
case "error" : iconCss = _error_iconCss; break; 
case "warning" : iconCss = _warning_iconCss; break; 
default : iconCss = _alert_iconCss; break; 
} var htmlStr = "<div id='" + type + "Div' style='display: none;'><p><span class='" + iconCss + "' style='float:left; margin:0 7px 50px 0;width:35px;height:35px;'></span>" + msg + "</p></div>"; 
return htmlStr; 
} 
function Alert(msg, okCallback) { 
var title = "提示"; 
var type = "alert"; 
var html = dialogInit(type, msg); 
var div = $("body").find("#"+type+"Div"); 
div.remove(); 
$('body').append($(html)); 
var buttons = {"确定" : function () { 
if(okCallback) okCallback(); 
$(this).dialog("close"); 
} 
}; 
$("#"+type+"Div").dialog({ 
modal : true, 
title : title, 
buttons : buttons 
}); 
} 
function Confirm(msg, okCallback, cancelCallback) { 
var title = "确认"; 
var type = "confirm"; 
var html = dialogInit(type, msg); 
var div = $("body").find("#"+type+"Div"); 
div.remove(); 
$('body').append($(html)); 
var buttons = {"确定" : function () { 
if(okCallback) okCallback(); 
$(this).dialog("close"); 
}, 
"取消" : function () { 
if(cancelCallback) cancelCallback(); 
$(this).dialog("close"); 
} 
}; 
$("#"+type+"Div").dialog({ 
modal : true, 
title : title, 
buttons : buttons 
}); 
} 
function Error(msg, okCallback) { 
var title = "错误"; 
var type = "error"; 
var html = dialogInit(type, msg); 
var div = $("body").find("#"+type+"Div"); 
div.remove(); 
$('body').append($(html)); 
var buttons = {"确定" : function () { 
if(okCallback) okCallback(); 
$(this).dialog("close"); 
} 
}; 
$("#"+type+"Div").dialog({ 
modal : true, 
title : title, 
buttons : buttons 
}); 
} 
function Warning(msg, okCallback) { 
var title = "警告"; 
var type = "warning"; 
var html = dialogInit(type, msg); 
var div = $("body").find("#"+type+"Div"); 
div.remove(); 
$('body').append($(html)); 
var buttons = {"确定" : function () { 
if(okCallback) okCallback(); 
$(this).dialog("close"); 
} 
}; 
$("#"+type+"Div").dialog({ 
modal : true, 
title : title, 
buttons : buttons 
}); 
}
Javascript 相关文章推荐
javascript 实现父窗口引用弹出窗口的值的脚本
Aug 07 Javascript
JavaScript delete 属性的使用
Oct 08 Javascript
简易js代码实现计算器操作
Apr 15 Javascript
使用纯javascript实现放大镜效果
Mar 18 Javascript
leaflet的开发入门教程
Nov 17 Javascript
javascript中神奇的 Date对象小结
Oct 12 Javascript
vue组件传递对象中实现单向绑定的示例
Feb 28 Javascript
使用Object.defineProperty如何巧妙找到修改某个变量的准确代码位置
Nov 02 Javascript
vue项目前端知识点整理【收藏】
May 13 Javascript
如何优雅地在Node应用中进行错误异常处理
Nov 25 Javascript
js 压缩图片的示例(只缩小体积,不更改图片尺寸)
Oct 21 Javascript
Vue 401配合Vuex防止多次弹框的案例
Nov 11 Javascript
jquery触发a标签跳转事件示例代码
Jul 21 #Javascript
用JavaScript实现动画效果的方法
Jul 20 #Javascript
JavaScript实现页面实时显示当前时间的简单实例
Jul 20 #Javascript
js动态创建表格,删除行列的小例子
Jul 20 #Javascript
JavaScript中setAttribute用法介绍
Jul 20 #Javascript
jquery动态添加删除div 具体实现
Jul 20 #Javascript
JavaScript将相对地址转换为绝对地址示例代码
Jul 19 #Javascript
You might like
博士208HAF收音机实习报告
2021/03/02 无线电
服务器web工具 php环境下
2010/12/29 PHP
PHP基于ORM方式操作MySQL数据库实例
2017/06/21 PHP
jQuery 相关控件的事件操作分解
2009/08/03 Javascript
js输出列表实现代码
2010/09/12 Javascript
JQuery判断HTML元素是否存在的两种解决方法
2013/12/26 Javascript
加载列表时jquery获取ul中第一个li的属性
2014/11/02 Javascript
JavaScript中常见获取元素的方法汇总
2015/03/04 Javascript
详解JavaScript的AngularJS框架中的作用域与数据绑定
2016/03/04 Javascript
使用Javascript监控前端相关数据的代码
2016/10/27 Javascript
Vue表单类的父子组件数据传递示例
2018/05/03 Javascript
微信小程序实现聊天对话(文本、图片)功能
2018/07/06 Javascript
JS实现的类似微信聊天效果示例
2019/01/29 Javascript
详解服务端预渲染之Nuxt(介绍篇)
2019/04/07 Javascript
基于layui的table插件进行复选框联动功能的实现方法
2019/09/19 Javascript
Python读取word文本操作详解
2018/01/22 Python
python发送告警邮件脚本
2018/09/17 Python
python读csv文件时指定行为表头或无表头的方法
2019/06/26 Python
python画图--输出指定像素点的颜色值方法
2019/07/03 Python
python实现XML解析的方法解析
2019/11/16 Python
Python读取实时数据流示例
2019/12/02 Python
python+requests接口压力测试500次,查看响应时间的实例
2020/04/30 Python
在keras下实现多个模型的融合方式
2020/05/23 Python
纯CSS3实现的阴影效果
2014/12/24 HTML / CSS
详解CSS3中Media Queries的相关使用
2015/07/17 HTML / CSS
Dr. Martens马汀博士法国官网:马丁靴鼻祖
2020/01/15 全球购物
英国第一的滑雪服装和装备零售商:Snow+Rock
2020/02/01 全球购物
总经理职责范文
2013/11/08 职场文书
亲子运动会的活动方案
2014/08/17 职场文书
医院深入开展党的群众路线教育实践活动实施方案
2014/08/27 职场文书
邀请书格式范文
2015/02/02 职场文书
幼儿教师年度个人总结
2015/02/05 职场文书
面试通知短信
2015/04/20 职场文书
电话营销开场白
2015/05/29 职场文书
2015年暑期见闻
2015/07/14 职场文书
Zabbix对Kafka topic积压数据监控的问题(bug优化)
2022/07/07 Servers