弹窗

 function component_modal(settings) {
     var PROMPTS = {
         modal: '<div class="modal-dialog"><div class="modal-content">' +
         '<div class="modal-header">' +
         '<button type="button" class="close" data-dismiss="modal" aria-hidden="true">&times;</button>' +
         '<h4 class="modal-title">模态框（Modal）标题</h4>' +
         '</div>' +
         '<div class="modal-body clearfix">在这里添加一些文本</div></div>'
     };


     var settings = $.extend({}, {
         id: null,
         container: $(document.body),
         trigger: $(document.body), //触发提示的
         title: null, //title
         content: null,
         width: 622,
         offsetX: 0,
         offsetY: 0,
         zindex: 99999,
         backdrop: true,//true false是隐藏灰色背景
         times: 3000,
         call_func_before: null, //添加回调--弹框出现，消失之前调用
         call_func: null //添加回调--弹框消失之后调用
     }, settings);
     var component_modal = {
         initialize: function () {
             var element = $('<div class="modal fade" tabindex="-1"  aria-hidden="true"></div>');
             var prompt = $(PROMPTS.modal);
             element.empty();
             element.append(prompt);
             element.attr('id', settings.id);
             if (settings.title) {
                 element.find('.modal-title').text(settings.title);
             }
             if (settings.content) {
                 element.find('.modal-body').html(settings.content);
             }
             if (!settings.backdrop) {
                 element.modal({backdrop: false});
             }else {
                 element.modal({backdrop: settings.backdrop});
             }
             element.find('.modal-dialog').width(settings.width);
             element.css({
                 'position': 'fixed',
                 'height': 'auto',
                 'bottom': 'auto',
                 'right': 'auto',
                 'display': 'none',
                 'z-index': settings.zindex
             });
             settings.container.find('.modal').remove();
             element.appendTo(settings.container);
             var o_height = $(window).height() / 2 - element.height() / 2;
             var o_width = $(window).width() / 2 - element.width() / 2;
             element.css('top', o_height);
             element.css('left', o_width);
             settings.element = element;
             this.show();
         },
         show: function (type) {
             this._show();
             return this;
         },
         _show: function () {
             var _this = this;
             var triggerPos,
                 _height = settings.trigger.height(),
                 _width = settings.trigger.width();
             if (settings.trigger.parent().get(0) == document.body) {
                 triggerPos = settings.trigger.offset();
             } else {
                 triggerPos = settings.trigger.position();
             }
             if (triggerPos && !settings.trigger.is(":hidden")) {
                 if (settings.trigger.css('position') == "absolute") {
                     triggerPos = {top: 0, left: 0};
                 }
             }
             var element = settings.element;
             // 如果没有背景，定位弹框
             if (!settings.backdrop) {
                 element.css({
                     "top": triggerPos.top + 1 + settings.offsetY,
                     "left": triggerPos.left + 1 + settings.offsetX,
                     "width": _width - 2,
                     "height": _height - 2
                 });
             }
             element.modal('show');
             element.on('shown.bs.modal', function () {
                 if (typeof settings.call_func_before == "function") {
                     settings.call_func_before();
                 }
             });
             $('[data-submit=ok]').click(function () {
                 _this.hide();
                 if (typeof settings.call_func == "function") {
                     settings.call_func();
                 }
                
             });
             
             $('[data-submit=save]').click(function () {
                 if (typeof settings.call_func == "function") {
                     settings.call_func();
                 }
                
             });
             
             element.on('hidden.bs.modal', function () {
                 _this.hide();
             });
         },
         hide: function () {
             if (settings.element) {
                 settings.element.modal('hide');
             }
             $('.modal-backdrop').remove();
             return this;
         },
         toggle: function () {
             if (settings.element) {
                 settings.element.modal('toggle');
             }
             return this;
         }
     };
     component_modal.initialize();
     return settings.element;
 }