• 对Bootstrap一层封装


    <div id="com-alert" class="modal" style="z-index:9999;display: none;" >
        <div class="modal-dialog modal-sm">
            <div class="modal-content">
                <div class="modal-header">
                    <button type="button" class="close" data-dismiss="modal"><span aria-hidden="true">×</span><span class="sr-only">Close</span></button>
                    <h5 class="modal-title"><i class="fa fa-exclamation-circle"></i> [Title]</h5>
                </div>
                <div class="modal-body small">
                    <p>[Message]</p>
                </div>
                <div class="modal-footer" >
                    <button type="button" class="btn btn-primary ok" data-dismiss="modal">[BtnOk]</button>
                    <button type="button" class="btn btn-default cancel" data-dismiss="modal">[BtnCancel]</button>
                </div>
            </div>
        </div>
    </div>
    $(function () {
            window.Modal = function () {
                var reg = new RegExp("\[([^\[\]]*?)\]", 'igm');
                var alr = $("#com-alert");
                var ahtml = alr.html();
    
                var _tip = function (options, sec) {
                    alr.html(ahtml);    // 复原
                    alr.find('.ok').hide();
                    alr.find('.cancel').hide();
                    alr.find('.modal-content').width(500);
                    _dialog(options, sec);
    
                    return {
                        on: function (callback) {
                        }
                    };
                };
    
                var _alert = function (options) {
                    alr.html(ahtml);  // 复原
                    alr.find('.ok').removeClass('btn-success').addClass('btn-primary');
                    alr.find('.cancel').hide();
                    _dialog(options);
    
                    return {
                        on: function (callback) {
                            if (callback && callback instanceof Function) {
                                alr.find('.ok').click(function () { callback(true) });
                            }
                        }
                    };
                };
    
                var _confirm = function (options) {
                    alr.html(ahtml); // 复原
                    alr.find('.ok').removeClass('btn-primary').addClass('btn-success');
                    alr.find('.cancel').show();
                    _dialog(options);
    
                    return {
                        on: function (callback) {
                            if (callback && callback instanceof Function) {
                                alr.find('.ok').click(function () { callback(true) });
                                alr.find('.cancel').click(function () { return; });
                            }
                        }
                    };
                };
    
                var _dialog = function (options) {
                    var ops = {
                        msg: "提示内容",
                        title: "操作提示",
                        btnok: "确定",
                        btncl: "取消"
                    };
    
                    $.extend(ops, options);
    
                    var html = alr.html().replace(reg, function (node, key) {
                        return {
                            Title: ops.title,
                            Message: ops.msg,
                            BtnOk: ops.btnok,
                            BtnCancel: ops.btncl
                        }[key];
                    });
    
                    alr.html(html);
                    alr.modal({
                         250,
                        backdrop: 'static'
                    });
                }
    
                return {
                    tip: _tip,
                    alert: _alert,
                    confirm: _confirm
                }
    
            }();
        });
        function showTip(msg, sec, callback){
            if(!sec) {
                sec = 1000;
            }
            Modal.tip({
                title:'提示',
                msg: msg
            }, sec);
            setTimeout(callback, sec);
        }
    
        /**
         * 显示消息
         * @param msg
         */
        function showMsg(msg, callback){
            Modal.alert({
                title:'提示',
                msg: msg,
                btnok: '确定'
            }).on(function (e) {
                if(callback){
                    callback();
                }
            });
        }
    
        /**
         * 模态对话框
         * @param msg
         * @returns
         */
        function showConfirm(msg,callback){
            //var res = false;
            Modal.confirm(
                {
                    title:'提示',
                    msg: msg,
                }).on( function (e) {
                callback();
                //res=true;
            });
            //return res;
        }

    调用:

    //提示

    showTip("haha", 1000, function() {});


    showMsg("haha", function() {});

    showConfirm("haha",function(){});

    传统的删除操作:

    var isDel = confirm("真的确定要删除吗?");
    if (false == isDel) {
    return;
    }
  • 相关阅读:
    eclipse安装m2e
    Ubuntu安装Maven(转)
    父亲节点的实现
    vscode go linux 依赖包
    golang DHCPv4/v6 demo
    解决golang.org模块无法下载的问题
    go 网络数据包分析(3)
    go 网络数据包分析(2)
    Go语言:判断IP是否合法是IPv4还是IPv6
    go IP地址转化为二进制数
  • 原文地址:https://www.cnblogs.com/su-ke/p/13721028.html
Copyright © 2020-2023  润新知