点击时动态加载包含 iframe 的模式？

Posted 2023-05-09

【中文标题】点击时动态加载包含 iframe 的模式？

【英文标题】：Dynamically load a modal containing iframe on click?

【发布时间】：2015-06-20 14:35:00

【问题描述】：

我需要一个包含 iframe（这是一个完整的外部页面）的模式来填充 Bootstrap 模式窗口，问题是页面非常大，所以我不希望它在模式事件被触发之前加载。 jQuery/Bootstrap 可以做到这一点吗？

【问题讨论】：

所以您希望模态框在用户等待时什么都没有弹出？在页面初始加载后在后台加载页面不是更好的用户体验，因此如果模式弹出，内容会尽快可用？

不，除非单击它，否则我不希望页面增加膨胀。大多数用户不会点击它，而且该网站的移动流量很大，我不想让移动设备负担过重或对响应式 javascript 大惊小怪。

【参考方案1】：

是的，只需设置src 属性：

$("#youriframe").attr("src", url);

虽然如果可能的话，我会在点击打开模式之前预加载 iframe（正如 cmets 中提到的那样），以减少用户必须等待的时间。

如果您想在模式关闭时清除 iframe，只需将 src 属性设置为“about:blank”。