我在一个正在加载远程内容的网站上有一堆Bootstrap模式窗口.这很完美.但是,我的老板告诉我,这些模态中的链接无法进入新页面,必须在模态窗口中重新加载.
我尝试了一些没有运气的事情.
首先,我在模态中有模态链接
<a data-toggle='modal' class='modalBox' data-target='#largeModal' href='link here'>Link</a>
TypeError: 'undefined' is not a function (evaluating 'b.preventDefault()')
所以我尝试将Id改为我在页面上的另一个模态窗口,它确实弹出了已存在的模态窗口.这不是我需要的,但很有希望.
解决方法
正如@Chevi建议的那样,最好的选择是在模态中放置一个iframe.您无需更改现有的页面/模态布局,因为您可以在每个klick上插入新的iframe.
鉴于你有一个带有.modal-body内部链接的bootstrap模态,你需要这样的东西：
$('.modal').on("click","a",function (e) {
var target = $(this).attr('href');
$('.modal-body').html('');
$('<iframe>').attr('src',target).appendTo($('.modal-body'));
e.preventDefault();
});
这会抓取点击链接的href,用iframe替换.modal-body内容,并将iframe的src设置为链接的href.
