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);
});

编辑

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

Answer 1

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

更多信息在这里:

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

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