2012-02-23 87 views
2

HTML代碼如何使用fancybox顯示word文檔。

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

jQuery代碼

​​

它的顯示所請求的內容不能被加載,請稍後再試....我也得到一個下載該文件的文件......哪有我使用fancybox顯示文檔文件

+5

一般情況下,Word文件不會自動顯示在瀏覽器中。它不是支持的網絡格式。 – Orbling 2012-02-23 18:21:54

+0

不可以在fancybox中顯示? – dude 2012-02-23 18:22:58

+0

不可能在fancybox或一般瀏覽器中顯示。 – j08691 2012-02-23 18:24:50

回答

3

您不能。瀏覽器沒有任何內置的方式來查看Word文檔,所以除非用戶配置瀏覽器使用某個插件(世界上99%的瀏覽器尚未完成)打開它,否則瀏覽器將提示他們下載文件。

0

據我所知,您將需要某種插件,將知道如何處理該MIME類型。除此之外,這是不可能的。

同樣適用於任何文件類型...

11

更新:2017年1月29日

谷歌文檔查看器允許Word文檔被視爲一個(只讀)的文件,而不是圖像(因爲它以前的工作),所以你實際上可以從顯示的文檔中選擇並複製到另一個文檔中。

增加了JSFIDDLE使用的fancybox v2.1.5


唯一可能的方式做到這一點沒有上述的所有問題是使用谷歌文檔瀏覽者通過iframe來顯示文件的圖像。 ..所以這個腳本:

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

與這個網站:

<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」處理點擊。

+0

適合我的需求。 – 2013-01-09 07:21:06

+0

它顯示無法預覽:( – Aamir 2016-01-21 11:55:15

+0

@Aamir它意味着文檔的路徑(或文檔名稱)不正確 – JFK 2016-01-24 21:52:30

0

您可以使用此代碼,短小精悍(用的fancybox最新版本) -

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

如果您$ URL可以是這樣的 -

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