我想做的就是将 div 中 id 为“pdf”的内容打印成 pdf。这必须使用 JavaScript 来完成。然后应自动下载文件名为“foobar.pdf”的“pdf”文档 我正在使用 jsPDF 脚本。它抛出“Uncaught TypeError: Cannot read property 'name' of undefined”
异常[在此处输入链接描述][1]
function demoFromHTML() {
debugger;
var pdf = new jsPDF('p', 'pt', 'letter');
source = $('#divInvoice')[0];
var Name = $("#spnorderno").text();
specialElementHandlers = {
'#editor': function (element, renderer) {
return true
}
};
margins = {
top: 80,
bottom: 60,
left: 40,
width: 522
};
pdf.fromHTML(
source,
margins.left,
margins.top, {
'width': margins.width,
'elementHandlers': specialElementHandlers
},
function (dispose) {
pdf.save('Invoice'+Name+'.pdf');
}, margins);
}<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<script src="https://code.jquery.com/jquery-2.1.4.min.js"></script>
<script src="http://mrrio.github.io/jsPDF/dist/jspdf.debug.js"></script>
<div style="width:800px; border-top:5px solid #1dbbe3; margin:0px auto; padding:25px; border-left:1px solid #ccc; border-bottom:1px solid #ccc; border-right:1px solid #ccc; font-family: Arial; font-size:13px; font-weight:normal; text-decoration:none; line-height:19px;">
<div class="printBox">
<table width="100%" style="margin-bottom:30px;">
<tr>
<td align="left" valign="middle">LOGO</td>
<td align="right" valign="middle" style="font-size:20px;">LAB</td>
</tr>
<tr>
<td align="left" valign="middle" height="60"><span style="color:#757575;">Address:</span><br>
<span>INDIA</span></td>
<td align="right" valign="top"><span style="color:#757575;">Address:</span><br>
<span>INDIA</span></td>
</tr>
<tr>
<td align="left" valign="middle"><span style="color:#757575;">Contact No.:</span> <br>
<span>+000000000000</span></td>
<td align="right" valign="middle"><span style="color:#757575;">Contact No.:</span> <br>
<span>+000000000</span></td>
</tr>
</table>
<table width="100%" style="border-top:3px solid #ccc; margin-top:15px;">
<tr>
<td style="border-bottom:1px solid #ccc;padding: 6px 0 8px;"><span style="color:#757575;">Patient name:</span> <span style="color:#1dbae3; font-weight:bold;">Rahul Kumar Sharma</span></td>
</tr>
<tr>
<td style="border-bottom:1px solid #ccc;padding: 6px 0 8px;"><span style="color:#757575;">Age:</span> <span>25 year</span></td>
</tr>
<tr>
<td style="padding: 7px 0 20px;"><span style="color:#757575;">Gender: </span><span>male</span></td>
</tr>
</table>
<table width="100%" style="border-top:3px solid #ccc; margin-top:15px;" cellpadding="0" cellspacing="0">
<tr>
<td style="border-bottom:1px solid #ccc;padding: 15px 0 12px; font-size:16px;" colspan="3" align="left">Order No: <span style="color:#fe8534;">O1500002200</span></td>
<td style="border-bottom:1px solid #ccc;padding: 15px 0 12px;" colspan="2" align="right"><span style="color:#757575;">Order Date:</span> 28 October 2015 11:07AM</td>
</tr>
<tr>
<td style="border-bottom:1px solid #ccc;padding: 6px 0 8px; font-weight:bold;" width="7%" align="left">S. No.</td>
<td style="border-bottom:1px solid #ccc;padding: 6px 0 8px; font-weight:bold;" colspan="3" align="left">Investigations</td>
<td style="border-bottom:1px solid #ccc;padding: 6px 0 8px; font-weight:bold;" width="19%" align="right" valign="middle">Amount</td>
</tr>
<tr>
<td style="border-bottom:1px solid #ccc;padding: 6px 0 8px;" align="left" valign="middle">1</td>
<td style="border-bottom:1px solid #ccc;padding: 6px 0 8px;" colspan="3" align="left" valign="middle">Senior Citizen Package Male</td>
<td style="border-bottom:1px solid #ccc;padding: 6px 0 8px;" align="right" valign="middle">Rs. 2000</td>
</tr>
<tr>
<td style="border-bottom:1px solid #ccc;padding: 6px 0 8px;" align="left" valign="middle">2</td>
<td style="border-bottom:1px solid #ccc;padding: 6px 0 8px;" colspan="3" align="left" valign="middle">Senior Citizen Package Male</td>
<td style="border-bottom:1px solid #ccc;padding: 6px 0 8px;" align="right" valign="middle">Rs. 2000</td>
</tr>
<tr>
<td style="border-bottom:1px solid #ccc;padding: 6px 0 8px;" align="left" valign="middle">3</td>
<td style="border-bottom:1px solid #ccc;padding: 6px 0 8px;" colspan="3" align="left" valign="middle">Senior Citizen Package Male</td>
<td style="border-bottom:1px solid #ccc;padding: 6px 0 8px;" align="right" valign="middle">Rs. 2000</td>
</tr>
<tr>
<td style="border-bottom:1px solid #ccc;padding: 6px 0 8px;" align="left" valign="middle">4</td>
<td style="border-bottom:1px solid #ccc;padding: 6px 0 8px;" colspan="3" align="left" valign="middle">Senior Citizen Package Male</td>
<td style="border-bottom:1px solid #ccc;padding: 6px 0 8px;" align="right" valign="middle">Rs. 2000</td>
</tr>
<tr>
<td colspan="5"><table width="100%" cellpadding="0" cellspacing="0">
<tr>
<td style="border-bottom:1px solid #ccc;padding: 6px 0 8px; font-weight:bold;" width="82%" align="right" valign="middle">Sub Total:</td>
<td style="border-bottom:1px solid #ccc;padding: 6px 0 8px; font-weight:bold;" width="18%" align="right" valign="middle">Rs. 12000</td>
</tr>
<tr>
<td style="border-bottom:1px solid #ccc;padding: 6px 0 8px;" align="right" valign="middle">Discount:</td>
<td style="border-bottom:1px solid #ccc;padding: 6px 0 8px;" align="right" valign="middle">Rs. 12000</td>
</tr>
<tr>
<td style="border-bottom:1px solid #ccc;padding: 6px 0 8px;" align="right" valign="middle">Promo Discount:</td>
<td style="border-bottom:1px solid #ccc;padding: 6px 0 8px;" align="right" valign="middle">Rs. 12000</td>
</tr>
<tr>
<td style="border-bottom:3px solid #ccc;padding: 6px 0 8px;" align="right" valign="middle">Your Price:</td>
<td style="border-bottom:3px solid #ccc;padding: 10px 0 10px; font-size:19px;" align="right" valign="middle"><b>Rs. 12000</b></td>
</tr>
</table></td>
</tr>
</table>
</div>
<div class="printBtnBox" style="margin-top: 25px;">
<a href="#" style="background:#1dbae3; padding: 8px 20px; border-radius:3px; color:#fff; text-decoration:none; font-size:16px;" onclick='demoFromHTML()'>Download</a>
</div>
</div>最佳答案
您是否检查了 $("#spnorderno").text() 返回的内容？这可能是未定义的。
除此之外，您应该发布错误发生的确切位置，这很可能发生在 jsPDF 库中。
关于javascript - 使用 jsPDF 或 javascript 将 HTML 页面中的 div 下载为 pdf，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/33435795/