非常简单的在网页中显示pdf文件内容的方法(JS代码实现)
有时候我们需要直接网页中显示pdf文件,而不是让嵌入的PDF文件只能点击下载后阅读,而我们又没有服务器的设置权限,没法去设置,这里提供一个非常简单的JS代码实现方法。
主要代码:
<script type="text/javascript" src="/js/pdfobject.js"></script>
<script type="text/javascript">
window.onload = function (){
var success = new PDFObject({ url: "pdf/CGVET22-08-2011V2P.pdf" ,pdfOpenParams: { scrollbars: '0', toolbar: '0', statusbar: '0'}}).embed("pdf1");
};
</script>
<div id="pdf1" style="width:700px; height:600px;">It appears you don't have Adobe Reader or PDF support in this web browser. <a href="~/pdf/CGVET22-08-2011V2P.pdf">Click here to download the PDF</a></div>
PDFObject.js,是一个 JavaScript 库用来在HTML中动态嵌入 PDF 文档。
只需要引用pdfobject.js,不需要额外的库
pdfobject.js文件内容如下:
/*
PDFObject v1.2.20111123
https://github.com/pipwerks/PDFObject
Copyright (c) Philip Hutchison
MIT-style license: http://pipwerks.mit-license.org/*/
/*jslint browser: true, sloppy: true, white: true, plusplus: true */
/*global ActiveXObject, window */
var PDFObject = function (obj){
if(!obj || !obj.url){ return false; }
var pdfobjectversion = "1.2",
//Set reasonable defaults
id = obj.id || false,
width = obj.width || "100%",
height = obj.height || "100%",
pdfOpenParams = obj.pdfOpenParams,
url,
pluginTypeFound,
//declare functions
createAXO,
hasReaderActiveX,
hasReader,
hasGeneric,
pluginFound,
setCssForFullWindowPdf,
buildQueryString,
get,
embed;
/* ---------------------------------------------------- Supporting functions ---------------------------------------------------- */
createAXO = function (type){
var ax;
try {
ax = new ActiveXObject(type);
} catch (e) {
//ensure ax remains null
ax = null; }
return ax; };
//Tests specifically for Adobe Reader (aka Acrobat) in Internet Explorer
hasReaderActiveX = function (){
var axObj = null;
if (window.ActiveXObject) {
axObj = createAXO("AcroPDF.PDF");
//If "AcroPDF.PDF" didn't work, try "PDF.PdfCtrl"
if(!axObj){ axObj = createAXO("PDF.PdfCtrl"); }
//If either "AcroPDF.PDF" or "PDF.PdfCtrl" are found, return true
if (axObj !== null) { return true; } }
//If you got to this point, there's no ActiveXObject for PDFs
return false; };
//Tests specifically for Adobe Reader (aka Adobe Acrobat) in non-IE browsers
hasReader = function (){
var i,
n = navigator.plugins,
count = n.length,
regx = /Adobe Reader|Adobe PDF|Acrobat/gi;
for(i=0; i<count; i++){
if(regx.test(n[i].name)){
return true; } }
return false; };
//Detects unbranded PDF support
hasGeneric = function (){
var plugin = navigator.mimeTypes["application/pdf"];
return (plugin && plugin.enabledPlugin); };
//Determines what kind of PDF support is available: Adobe or generic
pluginFound = function (){
var type = null;
if(hasReader() || hasReaderActiveX()){
type = "Adobe"; } else if(hasGeneric()) {
type = "generic"; }
return type; };
//If setting PDF to fill page, need to handle some CSS first
setCssForFullWindowPdf = function (){
var html = document.getElementsByTagName("html"),
html_style,
body_style;
if(!html){ return false; }
html_style = html[0].style;
body_style = document.body.style;
html_style.height = "100%";
html_style.overflow = "hidden";
body_style.margin = "0";
body_style.padding = "0";
body_style.height = "100%";
body_style.overflow = "hidden"; };
//Creating a querystring for using PDF Open parameters when embedding PDF
buildQueryString = function(pdfParams){
var string = "",
prop;
if(!pdfParams){ return string; }
for (prop in pdfParams) {
if (pdfParams.hasOwnProperty(prop)) {
string += prop + "=";
if(prop === "search") {
string += encodeURI(pdfParams[prop]);
} else {
string += pdfParams[prop]; }
string += "&"; } }
//Remove last ampersand
return string.slice(0, string.length - 1); };
//Simple function for returning values from PDFObject
get = function(prop){
var value = null;
switch(prop){
case "url" : value = url; break;
case "id" : value = id; break;
case "width" : value = width; break;
case "height" : value = height; break;
case "pdfOpenParams" : value = pdfOpenParams; break;
case "pluginTypeFound" : value = pluginTypeFound; break;
case "pdfobjectversion" : value = pdfobjectversion; break; }
return value; };
/* ---------------------------------------------------- PDF Embedding functions ---------------------------------------------------- */
embed = function(targetID){
if(!pluginTypeFound){ return false; }
var targetNode = null;
if(targetID){
//Allow users to pass an element OR an element's ID
targetNode = (targetID.nodeType && targetID.nodeType === 1) ? targetID : document.getElementById(targetID);
//Ensure target element is found in document before continuing
if(!targetNode){ return false; } }
else {
targetNode = document.body;
setCssForFullWindowPdf();
width = "100%";
height = "100%"; }
targetNode.innerHTML = '<object data="' +url +'" type="application/pdf" width="' +width +'" height="' +height +'"></object>';
return targetNode.getElementsByTagName("object")[0]; };
//The hash (#) prevents odd behavior in Windows
//Append optional Adobe params for opening document
url = encodeURI(obj.url) + "#" + buildQueryString(pdfOpenParams);
pluginTypeFound = pluginFound();
this.get = function(prop) { return get(prop); };
this.embed = function(id) { return embed(id); };
this.pdfobjectversion = pdfobjectversion;
return this;};顶(8)
踩(0)
上一篇:HTML+原生JS的倒计时小工具
- 最新评论
