0

我有一个带有 Google 文档和下载链接的页面（下面是人为的示例）。单击链接时，iframe 变为灰色并且根本不会返回。我已经剥离了页面，所以它只有这两个元素，它仍然会发生。

这肯定会发生在 Firefox、Chrome 和 Safari 中。

不包含 Google 文档的 iframe 似乎没有这个问题。

有任何想法吗？

<html>
<head></head>
<body>
<iframe src="http://docs.google.com/document/d/1mCYGLa8-Qsz_nYdk_f_8YefqWKMyulwVl223rebRMqM/preview" width="660" height="648"></iframe>
<a class="download_link" href="http://fastdl.mongodb.org/osx/mongodb-osx-i386-2.0.6.tgz">Download</a>
</body>
</html>
4

1 回答 1

0

有点讨厌的解决方案是target='_blank'在链接标签上设置。这会在单独的窗口中打开请求，但是一旦请求已注册为下载，该窗口将关闭并将用户留在原始页面上，而新的下载在后台。

这似乎在 Chrome 和 Firefox 上运行良好，但 Safari 在下载过程中会离开新窗口。

另一种解决方案是重新加载 iframe 设置，将其src属性设置为自身。唯一的问题是用户将失去他们的滚动位置。

我选择了混合解决方案，但确实做了一个巨大的假设，即所有版本的 Chrome 和 Firefox 都表现出相同的行为（下载开始时关闭选项卡）。这可能是不正确的，因此浏览器检测可能应该被改进。

或者，嘿，谷歌可以修复谷歌文档:)

        // preserve the google doc in the iframe. else the iframe goes gray when a download link is clicked
        if (navigator.userAgent.indexOf('Chrome') != -1 || navigator.userAgent.indexOf('Firefox') != -1){
            // Chrome and Firefox open new tabs with target='_blank' but close them again when the download begins
            // the page itself is unaffected
            $('a.download_link').attr('target', '_blank');
        }
        else{
            // the above doesn't work on Safari and probably others so fall back to reloading the iframe contents
            $('a.download_link').live('click', function(){
                $('iframe').each(function(id, frame){
                    frame.src = frame.src;
                });
            });
        }
于 2012-06-25T09:11:04.833 回答