javascript - 使用 jQuery 在 iframe(Word、PowerPoint、Excel)中查看文件

Question

我有一个 HTML 页面，其中有许多通过页面顶部的下拉菜单/无序列表显示的链接(使用 Bootstrap 3 导航栏)。这些链接指向内部服务器上托管的 MS Office 文档(Word、Excel、PowerPoint)。

通过单击链接，我希望在同一页面的 iframe 中打开它们，而不是使用单独的页面或下载。

我尝试了以下操作，但这总是打开标准弹出窗口以保存文件或在单独的窗口中打开它。

有人可以告诉我我在这里做错了什么吗？例如。除了刷新 iframe 之外还有什么？

我的链接下拉列表的 HTML(仅一项):

<li type='disc'><a href='javascript:void' class='navLink' name='test.pptx'>Text</a></li>

我的 iframe HTML:

<iframe src="#" width="100%" height="auto" frameborder="0" id="iView" name="iView"></iframe>

我的 jQuery:

$(document).on('click', '.navLink', function() {
    var fileName = $(this).attr('name');
    var fileLocation = 'http://somefilepath/uploads/';
    var fileSource = fileLocation + fileName;
    $('#iView').prop('src', fileSource);
});

编辑

如果这种方法不起作用，是否有办法在 HTML 网站中嵌入 MS Office 文档？

Answer 1

问题是您的网络服务器返回带有“Content-disposition:attachment”HTTP header 的文件。这会弹出“另存为/打开”对话框。您想要的是内联附件。

更多信息在这里:

Content-Disposition:What are the differences between "inline" and "attachment"?

注意:无法在客户端处理(即通过 JS)，您需要修改您的服务器应用程序。