下面是我的代码，我想通过点击value='print'生成pdf，其中div id ='letter'应该包含html中表单中的所有值。 div id="letter"应保留在PDF中，但它也包含html表单中的值。建议任何示例PDF
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>PDF</title>
<script type="text/javascript">
<!--
function OnEditChange(obj, ev, display) {
var key;
if (window.event) {
key = window.event.keyCode;
} else if (ev) {
key = ev.which;
}
var dest = document.getElementById("d-"+obj.name);
if (display) {
dest.style.display = (obj.value.length) ? display : 'none';
}
dest.innerHTML=obj.value;
return key;
}
function OnMPANKeyUp(ev) {
var key;
if (window.event) {
key = window.event.keyCode;
} else if (ev) {
key = ev.which;
}
var pc = document.getElementById("pc");
var mtc = document.getElementById("mtc");
var llf = document.getElementById("llf");
var rec = document.getElementById("rec");
var mpan1 = document.getElementById("mpan1");
var mpan2 = document.getElementById("mpan2");
var mpan3 = document.getElementById("mpan3");
var snumber = document.getElementById("snumber");
snumber.innerHTML = "<span style=\"font-weight: bold;\">" + pc.value + mtc.value + llf.value+" "+rec.value + mpan1.value+mpan2.value+mpan3.value + "</span>";
return key;
}
function OnMPANKeyPress(myfield, len, dec, e)
{
var key;
var keychar;
if (window.event)
key = window.event.keyCode;
else if (e)
key = e.which;
else
return true;
keychar = String.fromCharCode(key);
if ((key==null) || (key==0) || (key==8) || (key==9) || (key==13) || (key==27))
return true;
else if ((("0123456789").indexOf(keychar) > -1))
{
if (dec && myfield.value.length == len-1)
{
myfield.value += keychar;
dec.select();
return false;
}
return true;
}
return false;
}
-->
</script>
</head>
<body>
<div class="termination_centerinner">
<div class="innercontent">
<p>
This letter can be sent to your existing electricity supplier to inform them you wish to terminate your existing contract when it expires.
</p>
<p>
Fill in the details for yourself, your meter, and your current supply contract, then click on the 'Print' button.
</p>
</div>
<form action="termnotice.php?" method="post">
<input type="hidden" name="action" value="print" />
<span class="termination_form_descriptor">From:</span><input type="text" name="name" maxlength="80" style="width: 325px;" value="" onkeyup="return OnEditChange(this, event,'block')" /><br /><br />
<span class="termination_form_descriptor">Company:</span><input type="text" name="company" maxlength="120" style="width: 325px;" value="" onkeyup="return OnEditChange(this, event,'block')" /><br /><br />
<span class="termination_form_descriptor">Address:</span><input type="text" name="address1" maxlength="80" style="width: 325px;" value="" onkeyup="return OnEditChange(this, event,'block')" /><br />
<input class="termination_form_input_without_descriptor" type="text" style="width: 325px;" name="address2" maxlength="80" value="" onkeyup="return OnEditChange(this, event,'block')" /><br />
<input class="termination_form_input_without_descriptor" type="text" style="width: 325px;" name="city" maxlength="80" value="" onkeyup="return OnEditChange(this, event,'block')" /><br /><br />
<span class="termination_form_descriptor">Postcode:</span><input type="text" name="postcode" maxlength="10" size="10" value="" onkeyup="return OnEditChange(this, event,'block')" /><br /><br />
<span class="termination_form_descriptor supplier">Supplier:</span><input type="text" name="supplier" maxlength="80" style="width: 325px;" value="" onkeyup="return OnEditChange(this, event, 'block')" /><br /><br />
<span class="termination_form_descriptor">Address:</span><input type="text" name="sa1" maxlength="80" style="width: 325px;" value="" onkeyup="return OnEditChange(this, event, 'block')" /><br />
<input class="termination_form_input_without_descriptor" type="text" name="sa2" maxlength="80" style="width: 325px;" value="" onkeyup="return OnEditChange(this, event, 'block')" /><br />
<input class="termination_form_input_without_descriptor" type="text" name="sa3" maxlength="80" style="width: 325px;" value="" onkeyup="return OnEditChange(this, event, 'block')" /><br /><br />
<div class="termination_meterform">
<div class="termination_meterform_s">
S
</div><!-- S -->
<div class="termination_meterform_toprow">
<input name="pc" type="text" id="pc" size="5" maxlength="2" onkeypress="return OnMPANKeyPress(this, 2, mtc, event)" onkeyup="return OnMPANKeyUp(event)" />
<input name="mtc" type="text" id="mtc" size="6" maxlength="3" onkeypress="return OnMPANKeyPress(this, 3, llf, event)" onkeyup="return OnMPANKeyUp(event)" />
<input name="llf" type="text" id="llf" size="6" maxlength="3" onkeypress="return OnMPANKeyPress(this, 3, rec, event)" onkeyup="return OnMPANKeyUp(event)" />
</div><!-- toprow -->
<div class="termination_meterform_bottomrow">
<input name="rec" type="text" id="rec" size="2" maxlength="2" onkeyup="return OnMPANKeyUp(event)" onkeypress="return OnMPANKeyPress(this, 2, mpan1, event)" />
<input name="mpan1" type="text" id="mpan1" size="4" maxlength="4" onkeyup="return OnMPANKeyUp(event)" onkeypress="return OnMPANKeyPress(this, 4, mpan2, event)" />
<input name="mpan2" type="text" id="mpan2" size="4" maxlength="4" onkeyup="return OnMPANKeyUp(event)" onkeypress="return OnMPANKeyPress(this, 4, mpan3, event)" />
<input name="mpan3" type="text" id="mpan3" size="3" maxlength="3" onkeyup="return OnMPANKeyUp(event)" />
</div><!-- bottomrow -->
</div><!-- meterform -->
<br />
<span class="termination_form_descriptor">Expiry Date</span><input type="text" name="expirydate" maxlength="20" size="20" value="" onkeyup="return OnEditChange(this, event)" /><br />
<script type="text/javascript">
<!--
function printSelection(node) {
var content=node.innerHTML
var pwin=window.open('','print_content','width=100,height=100');
pwin.document.open();
pwin.document.write('<html><body onload="window.print()">'+content+'</body></html>');
pwin.document.close();
setTimeout(function(){pwin.close();},1000);
}
-->
</script>
<input class="termination_form_print_button" type="image" src="/images/print.png" alt="Print" value="Print" onclick="printSelection(document.getElementById('letter'));return false;" />
</form>
<div id="letter" class="letter">
<div style="text-align: right">
<div class="filled" id="d-company"></div>
<div class="filled" id="d-address1"></div>
<div class="filled" id="d-address2"></div>
<div class="filled" id="d-city"></div>
<div class="filled" id="d-postcode"></div>
<br />
18th Dec 2012 <br />
</div>
<br />
<div id="d-supplier"></div>
<div class="filled" id="d-sa1"></div>
<div class="filled" id="d-sa2"></div>
<div class="filled" id="d-sa3"></div>
<br />
<br />
Dear Sir/Madam<br />
<br />
<center><span style="font-weight: bold; text-decoration: underline;">Re: Termination Notice of Contract to Supply Electricity</span></center>
<br />
In accordance with your contract Terms and Conditions, I hereby give notice to terminate my Electricity Supply contract with you, on the contract expiry date for the meter detailed below.
<br />
<br />
<table>
<tr>
<td>
Supply 'S' Number
</td>
<td>
<div id="snumber"></div>
</td>
</tr>
<tr>
<td>Contract Expiry Date </td>
<td>
<span style="font-weight: bold;" id="d-expirydate"></span>
<br />
</td>
</tr>
</table>
<br />
I would be grateful if you could formally acknowledge receipt and acceptance of this Termination Notice of Contract to Supply Electricity in writing by return.
<br />
<br />
Yours faithfully,<br />
<div style="height:25mm;">
</div>
<div class="filled" id="d-name">
</div>
</div>
</div>
</body>
</html>
答案 0 :(得分：0)
也许这很有用：
答案 1 :(得分：0)
也许tcpdf是你的解决方案。你会看到足够多的例子：