简体   繁体   English

如何使用 javascript 将 html 输出打印成 Pdf

[英]How to Print the html output into Pdf using javascript

["

Here is my output image<\/a><\/i>这是我的输出图像<\/a><\/b><\/p>

Here is my code<\/i>这是我的代码<\/b><\/p>


let input = document.querySelector('input');<\/i>让输入 = document.querySelector('input');<\/b> var textarea = document.getElementsByClassName('area')[0];<\/i> var textarea = document.getElementsByClassName('area')[0];<\/b> var txtreplace = document.getElementsByClassName('demo')[0];<\/i> var txtreplace = document.getElementsByClassName('demo')[0];<\/b> window.addEventListener('load', function () { input.addEventListener('change', () => { let files = input.files; if (files.length == 0) return; const file = files[0]; let reader = new FileReader(); const fruits = []; reader.onload = (e) => { const file = e.target.result; const lines = file.split(\/\\r\\n|\\n\/); \/\/console.log(lines.length); textarea.value = lines.join('\\n'); lines.forEach(function (arrayItem) { \/\/console.log(arrayItem.replace("\E", " ")); var arr1 = arrayItem.replace("\E", ""); var arr2 = arr1.replace("\F", "<\/b> "); fruits.push(arr2); }); console.log(fruits.length); if (parseInt(fruits.length) > 0) { console.log(fruits); txtreplace.innerHTML = fruits; } };<\/i> window.addEventListener('load', function () { input.addEventListener('change', () => { let files = input.files; if (files.length == 0) return; const file = files[0] ; let reader = new FileReader(); const fruits = []; reader.onload = (e) => { const file = e.target.result; const lines = file.split(\/\\r\\n|\\n\/ ); \/\/console.log(lines.length); textarea.value = lines.join('\\n');lines.forEach(function (arrayItem) { \/\/console.log(arrayItem.replace("\E" , " ")); var arr1 = arrayItem.replace("\E", ""); var arr2 = arr1.replace("\F", "<\/b> "); fruits.push(arr2); }); 控制台。 log(fruits.length); if (parseInt(fruits.length) > 0) { console.log(fruits); txtreplace.innerHTML = fruits; } };<\/b>
 reader.onerror = (e) => alert(e.target.error.name); reader.readAsText(file); }); }, false); function printDiv() { var divContents = document.getElementsByClassName("demo").innerHTML; var a = window.open('', '', 'height=500, width=500'); a.document.write('<html>'); a.document.write('<body > <h1>Print PDF <br>'); a.document.write(divContents); a.document.write('<\/body><\/html>'); a.document.close(); a.print(); } <\/script> <\/body><\/code><\/pre><\/blockquote>"]

You can take a look at https://github.com/parallax/jsPDF .你可以看看https://github.com/parallax/jsPDF
It's js library allow you to build pdf using Javascript.它的 js 库允许您使用 Javascript 构建 pdf。

Otherwise have some solutions to convert html page to pdf ( https://www.html2pdf.co.uk/ ), but I don't think it's what you are looking for.否则有一些将 html 页面转换为 pdf 的解决方案( https://www.html2pdf.co.uk/ ),但我认为这不是你要找的。

Exemple of code using JSPDF :使用 JSPDF 的代码示例:

<script src="https://cdnjs.cloudflare.com/ajax/libs/jspdf/1.3.2/jspdf.min.js"></script>


var doc = new jsPDF();
doc.text(20, 20, 'Hello world!');
doc.text(20, 30, 'This is client-side Javascript, pumping out a PDF.');

doc.save('Test.pdf');

Hope it will helps you ;)希望它会帮助你;)

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM