如何使用fancybox展示Word文档

Question

HTML 代码

<div class='case'>
    <a href="http://localhost/DXXX/case/reqirement.doc" rel="case"> view</a>
</div>

Jquery 代码

$(".case").live('click', function(){
    $.fancybox({
        openEffect: 'elastic',
        closeEffect: 'elastic'
    });
});

显示请求的内容无法加载，请稍后再试...然后我得到了该文档文件的下载...如何使用Fancybox显示文档文件？

- dude

---

通常，Word文件不会自动在浏览器中显示。这不是一种被支持的网络格式。 - Orbling

无法在fancybox或一般浏览器中显示。 - j08691

@Orbling 是正确的，.doc 实际上是一个结构化 XML 文档集合，需要一个适当的文档阅读器才能打开。 - supertopi

如果你无法在浏览器中单独打开它，那么插件也不会有任何改善。 - Sparky

@dude：Word文档和浏览器不兼容，唯一的选择就是提供下载文件的选项。在某些环境下，IE浏览器可能会在浏览器窗口中打开此类文件，但前提是安装了Word，并且在IE中运行Word。通常情况下，这是不可行的。相应地，应该提供PDF文件，这仍然需要插件，但在各种平台和浏览器上得到更好的支持。 - Orbling

Answer 1

更新：2017年1月29日

Google Docs Viewer允许将Word文档作为（只读）文档而不是图像（以前的工作方式），因此您实际上可以从显示的文档中选择并复制到另一个文档中。

添加了一个JSFIDDLE，使用Fancybox v2.1.5

---

唯一可能避免上述所有问题的方法是通过iframe使用Google文档查看器来显示文件的图像...因此这个脚本：

$(document).ready(function() {
 $(".word").fancybox({
  'width': 600, // or whatever
  'height': 320,
  'type': 'iframe'
 });
}); //  ready 

使用此HTML：

<a class="word" href="http://docs.google.com/gview?url=http://domain.com/path/docFile.doc&embedded=true">open a word document in fancybox</a>

...应该能解决问题。

请注意，您实际上没有打开Word文档，而是它的图像，如果您想要显示文档内容，则可以使用该方法。

顺便提一下，我注意到您必须在使用fancybox v2.x时。 在这种情况下，您根本不需要使用.live()方法，因为fancyBox v2已经使用“live”来处理点击事件。

- JFK

---

@Aamir 这意味着文档的路径（或文档名称）不正确。 - JFK

顺便说一句，如果有人正在尝试使用 .net 并且正在尝试从 localhost 显示文件（就像我一样），上面的方法不起作用，除非您使用一个将本地主机服务器发布为公共 URL 的工具。我使用了 Finch，它非常好用。 - Hugo Nava Kopp

@Aamir：为了演示目的，已将一个jsfiddle添加到答案中。 - JFK

在不将Word文件部署到服务器的情况下，是否可以在浏览器中打开文件？ - vijaya kumar

Answer 2

您无法在浏览器中查看Word文档，因为浏览器没有内置的查看方式。除非用户已经配置了浏览器使用某个插件打开它（但全球99%的用户都没有这样做），否则浏览器将提示下载该文件。

- j08691

Answer 3

据我所知，您需要一些能够处理该MIME类型的插件。除此之外是不可能的。

对于任何文件类型都是如此...

- Jovan Perovic

Answer 4

你可以使用这段简短的代码（带有最新版本的 Fancybox）-

$.fancybox.open({
            padding: 0,
            href: $url,
            type: 'iframe',
        });

你的 $url 可以是类似以下的内容 -

https://docs.google.com/viewer?url=<url for your file>&embedded=true

- zookastos