pdf.png
公共的pdf页面可以自己写，调用插件的代码也相对简单：
seePDF.html
seePDF.js
$(function() {
//文件服务器的路径
var picDownloadServerUrl = window && window.weapon ? window.weapon.picDownloadServer : ”，
//url中传递的pdf文件路径
pdfURL = Utils.getParamFromUrl(‘pdfURL’)，
//pdf浏览路径
s = picDownloadServerUrl + pdfURL;
//开始使用TouchPDF插件
$(“#myPDF”).pdf( {
title: ”,
source: s,
loadingWitdh: loadingWitdh,
loadingHeight: loadingHeight
} );
alert(‘可左右滑动翻页’);
})
项目中自己做了个简单的公共插件modal，是一个可以展示图片或者pdf的弹窗，pdf则使用iframe动态将自己的seePDF页面路径插入src。此处要注意src的路径以防出现跨域问题，可以使用一下代码对iframe中的pdf路径进行预测试：
Utils.js
var Utils = {
//展示文件类的页面
showFilePage: function(fileName) {
if (fileName.indexOf(‘.pdf’) > -1) {
var s = window.location.host + ‘/test/pdf/pdfURL=’ + fileName;
if (!s.indexOf(‘http’) > -1) {
s = ‘http://’ + s;
}
Utils.tetPage(s).then(function(){
window.location.href = s;
},
function(){
Utils.errorPage(‘文件不存在，请联系后台管理员！’);
});
}
}
//预测试文件类页面
tetPage: function(url) {
return $.ajax({
type: “GET”,
cache: false,
url: url,
data: “”,
success: function() {
console.log(‘1’)
},
error: function() {
console.log(‘2’)
}
});
}
}
某个业务模块的pdf展示页面:
newDetails.js
Utils.showFilePage(pdfName);