Как отобразить текстовый документ с помощью fancybox

Question

HTML код

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

Код запроса

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

показывает, что запрошенное содержимое не может быть загружено, повторите попытку позже .... И я получаю загрузку этого файла документа ... Как я могу отобразить файл документа с помощью fancybox

Answer 1

ОБНОВЛЕНИЕ: 29 января 2017 г.

Google Docs Viewer позволяет видеть документ Word как документ (только для чтения), а не как изображение (как это было раньше), так что вы можете фактически выбирать и копировать отображаемый документ в другой документ. *

Добавлено JSFIDDLE с использованием Fancybox v2.1.5

---

Единственный возможный способ сделать это без всех упомянутых выше проблем - использовать Google Docs Viewer для отображения изображения файла с помощью 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, а его изображение, которое будет работать, если вам нужно только показать содержимое документа.

Кстати, я заметил, что вы должны использовать fancybox v2.x. В этом случае вам вообще не нужен метод .live(), так как fancyBox v2 уже использует "live" для обработки кликов.

Answer 2

Вы не можете. Браузеры не имеют встроенного способа просмотра документов Word, поэтому, если пользователь не настроил свой браузер так, чтобы он открывал его с помощью какого-либо плагина (чего не было в 99% случаев), браузер предложит ему загрузить файл .

Answer 3

Вы можете использовать этот код, короткий и милый (с последней версией Fancybox) -

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

Где ваш $ url может быть что-то вроде -

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

Answer 4

Насколько я знаю, вам понадобится какой-то плагин, который будет знать, как обрабатывать этот тип MIME. Кроме этого это невозможно.

То же самое относится к любому типу файла ...