扩展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 : '

页面代码

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

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

相关文章

Bootstrip HTML 查询搜索常用格式模版 &lt;form class=&...
如何在按钮上加红色数字 您可以使用Bootstrap的badge组件来在...
要让两个按钮左右排列,你可以使用 Bootstrap 的网格系统将它...
是的,可以将status设置为布尔类型,这样可以在前端使用复选...
前端工程师一般用的是Bootstrap的框架而不是样式,样式一般自...
起步导入:<linkrel="stylesheet"href="b...