2016-06-08 4 views
0

Ниже часть моего кода, в котором я пытаюсь загрузить файл PDF:Как загрузить файл pdf на страницу html?

<div class="panel-body"> 
    <embed width="600" height="450" src="/pathOnMyPcFromROOT/myfile.pdf" 
     type="application/pdf" 
    </embed> 
</div> 

я только получить this(Click Here) ........ есть способ исправить это? есть ли способ щелкнуть ссылку и загрузить PDF-документы на новую вкладку?

+0

Я не эксперт в HTML, но это путь SRC правильно? Должна ли она начинаться с /, которая предложила бы самую верхнюю папку. Возможно, это должен быть pathOnMyPcFromRoot/myfile.pdf, или, может быть, вы хотите его от корня. –

+0

О, я забыл ... Является ли путь к исходному файлу доступным с вашим HTTP-процессом. –

+0

@AdmiralNoiseBottom Я использую тот же путь для одного и того же каталога, но для другого файла. это xml-файл, который я загружаю в парсер, и он работает. Итак, я полагаю, что каталог доступен по HTTP-процессу? –

ответ

0

Попробуйте IFrame тег:

<div class="panel-body"> 
    <iframe src="files/myfile.pdf" width="600" height="450"> 
</div> 

Обратите внимание, что программное обеспечение веб-сервера (XAMPP MAMP лампа??) Не позволит вам получить доступ к файлу PDF, за исключением со ссылкой на вебсервера. Лучшая идея заключается в том, чтобы поместить его в папку внутри папки, которая содержит index.php (или index.html) Файл:

public_html (a.k.a. htdocs or www) 
    - css (folder) 
    - files (folder) 
     - myfile.pdf 
    - js (folder) 
    - img (folder) 
    - index.html (file) 
+0

Хорошо, я нашел проблему: когда я использовал загрузчик xml, мне пришлось проложить путь от корня, чтобы он работал. По-видимому, это не так для доступа к файлу pdf. Мне нужно было только запустить путь из каталога, где находится мой php-файл. Ты был прав. Спасибо за помощь. –

0

возиться с этим. Я использую это все время. Измените css padding в соответствии с вашими потребностями, а также измените ширину и высоту html. Это отзывчивый код, поэтому он приспосабливается ко всему экрану размеры

/* Flexible iFrame */ 
 
    
 
.flexible-container { 
 
    position: relative; 
 
    padding-bottom: 56.25%; 
 
    padding-top: 30px; 
 
    height: 0; 
 
    overflow: hidden; 
 
} 
 
    
 
.flexible-container iframe, 
 
.flexible-container object, 
 
.flexible-container embed { 
 
    position: absolute; 
 
    top: 0; 
 
    left: 0; 
 
    width: 100%; 
 
    height: 100%; 
 
}
<!-- Responsive iFrame --> 
 
<div class="flexible-container"> 
 
<iframe src=source here" width="600" height="450" frameborder="0" style="border:0"></iframe> 
 
</div>