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中“基本类型”之争小结
Jan 03 Javascript
jQuery点击弹出下拉菜单的小例子
Aug 01 Javascript
JS的Document属性和方法小结
Sep 17 Javascript
JavaScript中的some()方法使用详解
Jun 09 Javascript
基于jQuery实现仿百度首页换肤背景图片切换代码
Aug 25 Javascript
javascript replace()第二个参数为函数时的参数用法
Dec 26 Javascript
jquery做个日期选择适用于手机端示例
Jan 10 Javascript
vue之父子组件间通信实例讲解(props、$ref、$emit)
May 22 Javascript
Vue实现的父组件向子组件传值功能示例
Jan 19 Javascript
Angular CLI 使用教程指南参考小结
Apr 10 Javascript
vue3修改link标签默认icon无效问题详解
Oct 09 Javascript
Vue 数据响应式相关总结
Jan 28 Vue.js
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
php 上传文件类型判断函数(避免上传漏洞 )
2010/06/08 PHP
php提取字符串中网站url地址的方法
2014/12/03 PHP
div+css布局的图片连续滚动js实现代码
2010/05/04 Javascript
JQuery FlexiGrid的asp.net完美解决方案 dotNetFlexGrid-.Net原生的异步表格控件
2010/09/12 Javascript
只需一行代码,轻松实现一个在线编辑器
2013/11/12 Javascript
js 定时器setTimeout无法调用局部变量的解决办法
2013/11/28 Javascript
checkbox全选所涉及到的知识点介绍
2013/12/31 Javascript
js加载读取内容及显示与隐藏div示例
2014/02/13 Javascript
jQuery统计指定子元素数量的方法
2015/03/17 Javascript
Jquery解析json字符串及json数组的方法
2015/05/29 Javascript
JS+CSS实现简易的滑动门效果代码
2015/09/24 Javascript
JavaScript中的return语句简单介绍
2015/12/07 Javascript
详解ES6中的let命令
2020/04/05 Javascript
微信小程序 HTTPS报错整理常见问题及解决方案
2016/12/14 Javascript
原生JS实现图片翻书效果
2017/02/16 Javascript
[01:07:41]IG vs VGJ.T 2018国际邀请赛小组赛BO2 第一场 8.18
2018/08/19 DOTA
浅谈Python浅拷贝、深拷贝及引用机制
2016/12/15 Python
python实现泊松图像融合
2018/07/26 Python
Python脚本完成post接口测试的实例
2018/12/17 Python
python写入数据到csv或xlsx文件的3种方法
2019/08/23 Python
Python 单例设计模式用法实例分析
2019/09/23 Python
CSS3实现网站商品展示效果图
2020/01/18 HTML / CSS
什么是数据库锁?Oracle中都有哪些类型的锁?
2015/08/21 面试题
如何防止同一个帐户被多人同时登录
2013/08/01 面试题
英语系本科生个人求职信
2013/09/21 职场文书
财务会计专业自荐书
2014/06/30 职场文书
应聘护士求职信
2014/07/21 职场文书
商铺消防安全责任书
2014/07/29 职场文书
英语课外活动总结
2014/08/27 职场文书
委托书范本
2014/09/13 职场文书
群众路线四风问题整改措施
2014/09/27 职场文书
银行先进个人总结
2015/02/15 职场文书
机关干部纪律作风整顿心得体会
2016/01/23 职场文书
html5调用摄像头实例代码
2021/06/28 HTML / CSS
适合后台管理系统开发的12个前端框架(小结)
2021/06/29 Javascript
CentOS安装Nginx并部署vue
2022/04/12 Servers