如何使用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显示文档文件

Answer 1

更新日期：2017年1月29日

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

使用Fancybox v2.1.5

添加了 JSFIDDLE

---

在没有上述所有问题的情况下，唯一可行的方法是使用Google文档查看器通过iframe显示文件的图像...所以此脚本：

$(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文档，而是打开它的图像，如果您想要的只是显示文档的内容，它将起作用。

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

Answer 2

你做不到。浏览器没有任何内置方式来查看Word文档，所以除非用户已将其浏览器配置为使用某个插件打开它（世界上99％的人还没有这样做），浏览器会提示他们下载文件

Answer 3

据我所知，你需要一些知道如何处理这种MIME类型的插件。除此之外，这是不可能的。

同样适用于任何文件类型......

Answer 4

您可以使用此代码，简短而甜蜜（使用Fancybox最新版本） -

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

你的$ url可以是 -

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