Question

我将pdf文档嵌入到我的html代码中。为此我写了这段代码。

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org

/TR/html4/loose.dtd">
<html lang="en">
<head>
    <meta http-equiv="Content-Type" content="text/html;charset=UTF-8">
    <title></title>
</head>
<body>
<object height="100%" width="100%" type="application/pdf" data="yii.pdf#toolbar=1&amp;navpanes=0&amp;scrollbar=1&amp;page=1&amp;view=FitH">

<p>It appears you don't have a PDF plugin for this browser. No biggie... you can <a href="/pdf/sample.pdf">click here to download the PDF file.</a></p>

</object>

</body>
</html>

但结果是FF4上的空白页面和IE9嵌入了pdf文件，但它的容器非常小，几乎是页面的30％。如果我删除第一行，即DOCTYPE两个浏览器都应该渲染pdf文件。以下代码工作正常。

<html lang="en">
<head>
    <meta http-equiv="Content-Type" content="text/html;charset=UTF-8">
    <title></title>
</head>
<body>
<object height="100%" width="100%" type="application/pdf" data="yii.pdf#toolbar=1&amp;navpanes=0&amp;scrollbar=1&amp;page=1&amp;view=FitH">

<p>It appears you don't have a PDF plugin for this browser. No biggie... you can <a href="/pdf/sample.pdf">click here to download the PDF file.</a></p>

</object>

</body>
</html>

我想在我的页面中使用doctype，以便其他页面正常工作。有没有办法修复包含doctype的第一个代码？

Answer 1

这基本上是@ tXK的答案（+1），但是有工作（经过测试）代码：

<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>Preview</title>
<style type="text/css">
html, body {
    margin: 0;
    padding: 0;
    border: 0;

    height: 100%;
    overflow: hidden;
}
iframe {
    width: 100%;
    height: 100%;
    border: 0
}
</style>
</head>

<body>

<iframe src=""></iframe>

</body>
</html>

Answer 2

有三种方法可以在HTML中显示PDF：使用embed，object或iframe。不幸的是，使用iframe不允许PDF 中的Adobe Javascript 以HTML格式向JS发布消息，因为hostContainer未定义。因此我被迫使用嵌入或对象。幸运的是， thirtydot 的样式代码也适用于对象。这是我的工作代码......

<!DOCTYPE html> <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8"> <title>Preview</title> <style type="text/css"> html, body { margin: 0; padding: 0; border: 0; height: 100%; overflow: hidden; } object { width: 100%; height: 100%; border: 0 } </style> <script language="javascript"> function handleMessage(msg) { alert('got message '+msg); } function setupHandler() { document.getElementById("myPdf").messageHandler = { onMessage: handleMessage }; } </script> </head> <body onLoad="setupHandler();"> <object id="myPdf" type="application/pdf" data="file_with_actions.pdf"> Unable to open the PDF file. </object> </body> </html>

您可以阅读有关Javascript内容的更多信息here。

Answer 3

我会尝试使用<iframe>元素如果没有，可能将其转换为闪存，然后嵌入闪存。

此外，请尝试<!doctype html>并查看其功能，这是HTML5的标准文档类型

使用object标签在PDF中嵌入PDF文件

3 个答案: