将弹出窗口打印替换为jspdf

Question

嗨我有点这个代码，有一个弹出窗口并下载pdf。 首先有很多问题，当我关闭并再次点击它时，它不再打开，第二，我想通过不弹出任何窗口直接下载到pdf。所以我想可以为此添加JSPDF，以便我可以直接下载吗？谢谢！

这是我的代码

var originalContents = document.body.innerHTML;       
document.body.innerHTML = originalContents;     
window.print();      
document.body.innerHTML = originalContents;
setTimeout(function () { window.close(); }, 100);

Answer 1

使用window.print()

的解决方案

要使用window.print()进行打印，您可以参考此代码段。

＆＃13;

＆＃13;

var button = document.getElementById('click');

button.onclick = function () {
  window.print();
}

＆＃13;

Today is a good day! 
<button id='click'> Click me! </button>

＆＃13;

＆＃13;

＆＃13;

问题

它无法正常工作的原因是您明确重新分配body代码的这一部分。

document.body.innerHTML = originalContents;     
originalContents = document.body.innerHTML; 

这将由此证明：

＆＃13;

＆＃13;

var button = document.getElementById('click');

button.onclick = function () {
  console.log('Can you see me?');
  var contents = document.body.innerHTML;
  document.body.innerHTML = contents;
}

＆＃13;

<button id='click'>click me<button>

＆＃13;

＆＃13;

＆＃13;

它不止一次不会安慰。

使用jsPDF

您可以替换弹出窗口并使用jsPDF库，如下所示：

＆＃13;

＆＃13;

var button = document.getElementById('click');

button.onclick = function () {
	var doc = new jsPDF();
  var originalContents = document.body.innerHTML;
  doc.text(originalContents, 10, 10);
	doc.save();
}

＆＃13;

<script src="https://cdnjs.cloudflare.com/ajax/libs/jspdf/1.3.4/jspdf.debug.js"></script>
Today is a good day! 
<button id='click'> Click me! </button>

＆＃13;

＆＃13;

＆＃13;