bootstrap弹出多个模态框_扩展bootstrap的modal模态框-动态添加modal框-弹出多个modal框...

js代码

0){

modal.remove();

initView();

}

}

/**打开modal*/

function openModal(event){

// var this = $(this);

var $this = $(event.currentTarget);

var _url = $this.attr("href");

var _title = $this.attr("title");

var _id;

_id = dialog.content();

var options = {

backdrop: false,keyboard: true,show: true

};

$('#' + _id).modal(options);

var modal = $('#' + _id);

if(typeof(_title) != "undefined"){

if(modal.find('.modal-title').length <= 0){

var header = dialog.header({title : _title});

$($.parseHTML(header)).appendTo(modal.find(".modal-content"));

}else{

modal.find('.modal-title').text(_title);

}

if(modal.find('.modal-body').length <= 0){

var _body = dialog.body;

$($.parseHTML(_body)).appendTo(modal.find(".modal-content"));

}

modal.find(".modal-body").load(_url,$.proxy(function () {

modal.trigger('loaded.bs.modal');

initView();

},this));

}else{

modal.find(".modal-content").load(_url,this));

}

//阻止事件默认行为

event.preventDefault();

}

//modal model

//TO STRAT

if(!$(window).data("_modal_id")){

$(window).data("_modal_id",0);

}

var dialog = {

header : function(options){

var template = '

'

+ '

'

+'';

return template;

},content : function(){

var _modal_id = $(window).data("_modal_id");

var _id = "_modal_id_" + _modal_id;

_modal_id ++;

$(window).data("_modal_id",_modal_id);

var template = '

'

+ ''

+'';

$(template).appendTo('body');

initView();

return _id;

},body : '

'

};

//TO END

页面代码：

title="请选择用餐类型">签到

页面上只要在a标签后加上target="dialog"，并且提供href外部链接地址就可以弹出modal框

以上所述是小编给大家介绍的扩展bootstrap的modal模态框-动态添加modal框-弹出多个modal框。编程之家 jb51.cc 收集整理的教程希望能对你有所帮助，如果觉得编程之家不错，可分享给好友！感谢支持。