Question

用户提交表单后，我想要打开iframe并覆盖整个屏幕。正常内容会崩溃，因此只能看到iframed内容。怎么做只需打开iframe，就会将所有内容留在它上面和下面。

<div id="iWait" style="display:none;"><center><iframe src="http://website.com" width="100%" height="100%"></iframe></center></div>

Answer 1

请注意，在代码中定义iframe会导致它在后台加载。如果不需要在以后加载页面，这可能会不必要地减慢页面速度。

从这样的HTML开始（注意fixed定位）：

<iframe id="preventBoredom" src="http://www.domain.com/" frameborder="0" style="position: fixed; left: 0; top: 0; right: 0; bottom: 0; z-index: 1000; display: none;"></iframe>

然后，用这样的.show()显示它：

$('#preventBoredom').show();

如果您只想在显示iframe时加载iframe，请将初始iframe src设置为空白HTML页面，然后使用此jQuery：

$('#preventBoredom').src('http://www.domain.com/').show();

请注意回复@ROY_Finley和@Mort_Goldman：我无法想象使用它的好情况，除非您打算在某个时候再次隐藏iframe。例如，您可能希望在航空公司搜索结果集加载时保持用户忙碌（这些通常需要一段时间才能加载）。但是这种方法让用户认为他们在另一个网站上 - 如果窗口突然被破坏，他们会感到恼火。

如果表单处理是一个慢速服务器任务，您应该在继续处理之前让处理脚本关闭输出。这将允许服务器在后台完成其工作，同时浏览器以快乐的方式进行。

打开iframe并折叠整个页面

1 个答案: