扩展bootstrap的modal模态框-动态添加modal框-弹出多个modal框
发布时间：2020-12-18 00:40:48 所属栏目：安全 来源：网络整理
导读：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(
|
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
页面代码： 页面上只要在a标签后加上target="dialog"，并且提供href外部链接地址就可以弹出modal框 以上所述是小编给大家介绍的扩展bootstrap的modal模态框-动态添加modal框-弹出多个modal框。编程之家 52php.cn 收集整理的教程希望能对你有所帮助，如果觉得编程之家不错，可分享给好友！感谢支持。 （编辑：李大同） 【声明】本站内容均来自网络，其相关言论仅代表作者个人观点，不代表本站立场。若无意侵犯到您的权利，请及时与联系站长删除相关内容! |