分享web开发知识

注册/登录|最近发布|今日推荐

主页 IT知识网页技术软件开发前端开发代码编程运营维护技术分享教程案例
当前位置:首页 > 网页技术

Pdf预览功能实现(asp.net)

发布时间:2023-09-06 02:16责任编辑:熊小新关键词:暂无标签

asp.net中使用

1.pdf预览功能实现的插件是pdfjs-1.5.188-dist

//引入插件中相关的文件以及jquery文件@section css{<link rel="stylesheet" href="~/pdfjs-1.5.188-dist/web/viewer.css"><script src="~/pdfjs-1.5.188-dist/web/compatibility.js"></script><link rel="resource" type="application/l10n" href="~/pdfjs-1.5.188-dist/web/locale/locale.properties"><script src="~/pdfjs-1.5.188-dist/web/l10n.js"></script><script src="~/pdfjs-1.5.188-dist/build/pdf.js"></script><script src="~/pdfjs-1.5.188-dist/web/debugger.js"></script><script src="~/pdfjs-1.5.188-dist/web/viewer.js"></script><script src="~/pdfjs-1.5.188-dist/build/pdf.worker.js"></script>}<div class="main"> ????@{Html.RenderPartial("preview_pdf");}</div>@section js{<script> ???????//页面加载的时候打开pdf文件 ???????$(window).load(function () { ??????????PDFViewerApplication.open("../../files/building_1/1.pdf"); ???????????????????});</script>}

 里面引入的preview_pdf其实是,pdfjs-1.5.188-dist/web/viewer.html中提取出来的主体部分id="

outerContainer"
,viewer.js就是pdfjs的例子。

vue中的使用

//table上点击预览事件<el-table-column fixed="right" label="操作"> ???<template slot-scope="scope"> ??????<el-button type="text" size="small" @click="previewInfo(scope.$index, scope.row)">预览</el-button> ???</template></el-table-column> //使用 iframe来显示pdf<div v-show="isshowpdf" ?> ???<el-button type="success" @click="backToList">返回</el-button> ???<iframe :src="pdfurls" height="730" width="100%"></iframe></div>previewInfo: function(index, row) { ?????if (index > 3 || index == 0) { ???????return this.$message("未找到对应的pdf文件!"); ?????} ?????let url = "../../../uploads/123_" + index + ".pdf"; ?????this.pdfurls = "/lib/pdf/web/viewer.html?file=" + url; ?????this.isshowpdf = true; ???},

  

Pdf预览功能实现(asp.net)

原文地址:https://www.cnblogs.com/xuqp/p/9707576.html

知识推荐

我的编程学习网——分享web前端后端开发技术知识。 垃圾信息处理邮箱 tousu563@163.com 网站地图
icp备案号 闽ICP备2023006418号-8 不良信息举报平台 互联网安全管理备案 Copyright 2023 www.wodecom.cn All Rights Reserved