使用jquery-confirm优化JS弹出框

jquery-confirm是一款可整合font-awesome，bootstrap一起使用的强大jQuery对话框和确认框插件

Demo演示地址：http://karle.vip/jc.html

css依赖

<link href="https://cdn.bootcss.com/jquery-confirm/3.2.3/jquery-confirm.min.css" rel="stylesheet"><link rel="stylesheet" href="https://cdn.bootcss.com/bootstrap/3.3.7/css/bootstrap.min.css" integrity="sha384-BVYiiSIFeK1dGmJRAkycuHAHRg32OmUcww7on3RYdg4Va+PmSTsz/K68vbdEjh4u" crossorigin="anonymous"><link href="https://cdn.bootcss.com/font-awesome/4.7.0/css/font-awesome.css" rel="stylesheet">

js依赖

<script src="https://cdn.bootcss.com/jquery/1.12.4/jquery.min.js "></script><script src="https://cdn.bootcss.com/jquery-confirm/3.2.3/jquery-confirm.min.js "></script><script src="https://cdn.bootcss.com/jquery.form/4.2.1/jquery.form.js"></script>

demo1(消息提示框)

function confirm_alert(msg) {    $.alert({        title: '系统提示',        content: msg,        icon: 'fa fa-comment',        type: 'green',        buttons: {            "是的": function() {            }        }    });}

---

demo2(消息提示框+倒计时操作)

function confirm_alert_ok_goto_dj(msg, url) {    $.alert({        title: '系统提示',        content: msg,        icon: 'fa fa-comment',        type: 'green',        autoClose: '好的|3000',        escapeKey: '好的',        buttons: {            "好的": {                btnClass: 'btn-blue',                action: function() {                    window.location.href = url;                }            }        }    });}

---

demo3(弹出框接收输入参数，Ajax提交)

function ajax_submit(id) {    $.confirm({        icon: 'fa fa-plus',        type: 'blue',        title: '添加数据',        content: '<div class="form-group"><input type="text" placeholder="请输入名称" class="param_name form-control" /></div>' +            '<div class="form-group"><input type="text" placeholder="请输入年龄" class="param_age form-control"/></div>',        buttons: {            '取消': function() {},            '添加': {                btnClass: 'btn-blue',                action: function() {                    var param_age = this.$content.find('.param_age').val();                    var param_name = this.$content.find('.param_name').val();                    confirm_alert("你提交的数据：id：" + id + "，名称：" + param_name + "，年龄：" + param_age);                    /*//此处可写Ajax请求                    $.get(url, {                            name: param_name,                            id: id,                            age: param_age                        },                        function(result) {                            //处理结果                        });*/                }            }        }    });}

更多示例请查看Demo，源码下载（3分）：http://download.csdn.net/download/qq_19260029/9972236