文章转载自：http://motyer.cn/Blog/Details/blog2016101519493910
在前端开发中，模态框是经常使用到的一个工具。撇开alert、confirm等自带的不谈，下面介绍一款使用jQuery来简单实现的提示框、确认框和输入框——MotyDialog。
在使用前需要引入样式文件dialog.css，脚本文件dialog.min.js。由于是基于jQuery的，所以必须在引入dialog.min.js前引入jQuery。
一、提示框
dialog.tip(title, text, ok);该方法具有三个参数：
1、title，字符串类型，提示框的标题；
2、text，字符串类型，提示框提示的具体内容；
3、ok，function类型，点击提示框确定按钮的回调函数。
dialog.tip("提示", "这是一个提示框。", function(){ alert("您关闭了提示框。"); });
二、确认框
dialog.confirm(title, text, ok, cancel);该方法有四个参数：
1、title，同上；
2、text，同上；
3、ok，function类型，点击确定按钮的回调函数；
4、cancel，function类型，点击取消按钮的回调函数。
dialog.confirm("确认", "请确认你有没有女朋友？", function(){alert("有。"); }, function(){ alert("没有。"); });
三、输入框
dialog.input(title, text, placeholder, ok, cancel);该方法有5个参数：
1、title，同上；
2、text，字符串类型，输入框的初始化文本；
3、placeholder，字符串类型，输入框的提示文本；
4、ok，点击确定按钮的回调函数，并且带一个字符串类型的参数，表示在输入框中已输入的文本内容；
5、cancel，点击取消按钮的回调函数，并且带一个字符串类型的参数，表示在输入框中已输入的文本内容。
dialog.input("输入", "", "请输入姓名", function(t){ alert(t); }, function(t){ alert(t); });
源代码已经托管在github上面了，有兴趣的可以下载看看，也可以帮助完善。