`

使用jquery简单封装的对话框

 
阅读更多
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
	});
	
}

分享到:
评论

相关推荐

    jquery封装的对话框简单实现

    本文为大家详细介绍下使用jquery简单实现封装的对话框,具体实现代码如下,感兴趣的朋友可以参考下哈,希望对大家有所帮助

    jQuery+bootstrap消息提示框对话框插件

    jQuery+bootstrap封装实现的消息提示框对话框插件,有多种样式,具体看演示页面。

    自制轻量级仿jQuery.boxy对话框插件代码

    导致文件较大(可忽略不计),很多功能并不需要,为此,抱着在边学边实践的态度和想法,自制一款适用于本项目的轻量级弹出层插件,这是第一次写jqeury插件,也为了以后能将常用操作封装为jquery插件做准备吧。...

    基于bootstrap4封装的消息对话框组件

    这是一款基于bootstrap4封装的消息对话框组件。该消息组件包括dialog,alert,confirm,input,success,error,notice。并且对话框支持鼠标或手指触摸拖拽。

    用jQuery实现的模态弹出窗口,封装了alert和confirm

    弹出窗口中含有的弹出窗口也在主窗体中创建,这样结构简单一点,比较容易管理。我在创建弹出窗口的时候在主窗体中声明一个栈,把当前iframe的window对象压入栈,这样不管我现在弹出了多少个窗口总能很容易的找到其中...

    jQuery权威指南-源代码

    虽然jQuery使用简单,但它毕竟是一门新的技术,与传统的JavaScript在性能与语法上存在诸多差异,需要相应的书籍来引导开发者们迅速而有效地掌握它,并能真正付诸实践。综观现在已经出版的中文类jQuery图书,不是...

    JQuery&CSS;&CSS;+DIV实例大全.rar

    4.jquery封装Tab标签选项卡,内含动画版选项卡及滑动门 5.jQuery实现flash动感切换选项卡TAB插件示例 6.jquery制作自动播放的TAB切换特效 7.基于jQuery简单的Tab滑动门菜单代码(jQuery MoveTab) 8.简单...

    强大的jquery插件jqeuryUI做网页对话框效果!简单

    大家都知道JQ是用JS帮我们封装好的东西,我们就要用到它其中强大的地方,废话就不说了.....

    jQueryUI的Dialog的简单封装

    DialogHelper的源代码如下: 代码如下: //–对话框辅助对象-begin //现在这个对象只是简单的封装(未来可能会复杂些)。 //其作用就是简化jQuery UI的dialog的的调用方式,不在需要改动独立的DOM结构,参数传递方式更...

    jQuery弹出层插件

    jQuery弹出层插件 登陆对话框/弹出自定义层/样式自定义/已封装好

    JQuery学习总结【一】

    我们在使用的时候将Jquery-1.4.2.js和jquery.1.4.2-vsdoc,js放在一起,其实vsdoc.js是对于前面的解释说明,它是让我们在编写代码的时候可以点操作出来。 *:练习《点击按钮弹出对话框的内容》 《点击网页里面的文字使...

    bootstrap消息对话框插件

    bootstrap消息对话框插件是一款jQuery基于bootstrap.js封装的消息对话框插件。

    bootstrap消息对话框插件特效代码

    bootstrap消息对话框插件是一款jQuery基于bootstrap.js封装的消息对话框插件。

    NFine快速开发框架.rar

    框架使用场景:OA、ERP、BPM、CRM、WMS、TMS、MIS等业务管理系统及后台系统 框架主要运用技术: 1、前端技术 JS框架:jquery-2.1.1、Bootstrap.js、JQuery UI CSS框架:Bootstrap v3.3.4(稳定是后台,UI方面根据...

    jquery div

    网页上的AJAX网页弹出层,弹出对话框,嵌套的网页弹出浮动层,可以关闭,可以自适应显示在网页浏览器的中央,不管浏览器窗口有多大,它都会显示在中间。运用了一个封装的JS库,实现一个浮动对话框的功能就更简单了。

    MVC快速开发框架

    对话框:layer-v2.3 下拉选择框:jQuery Select2 树结构控件:jQuery zTree、jQuery wdtree 页面布局:jquery.layout.js 1.4.4 图表插件:echarts、highcharts 日期控件: My97DatePicker 2、后端技术 ...

    快速开发框架NFine ASP.NET MVC+EF6+Bootstrap开发框架

    框架使用场景:OA、ERP、BPM、CRM、WMS、TMS、MIS等业务管理系统及后台系统 框架功能: 1.系统管理 机构管理、角色管理、岗位管理、用户管理、数据字典、区域管理 2.权限管理 系统菜单、系统按钮、角色权限分配 3....

    NFine快速开发框架源码 NFineRapidFramework.rar

    2、使用 Apache License 2.0 协议,采用主流框架,容易上手,简单易学,学习成本低。可完全实现二次开发、基本满足80%项目需求。 3、可以帮助解决 .NET 项目70%的重复工作,让开发更多关注业务逻辑。既能快速提高...

    jquery.boxy弹出框(后隔N秒后自动隐藏/自动跳转)

    对于 Boxy弹出框的使用之前写过一些文章(查看jquery.boxy基础),今天主要是在解决一个需要之后,觉得值得把它记录下来,所以就再写一篇,主要功能是,在弹出对话框后,隔N秒后自动隐藏,还有就是自动跳转!...

Global site tag (gtag.js) - Google Analytics