①jquery版本打印
使用插件jquery.PrintArea.js
示例
<input type="button" id="btnPrint" value="打印"/>
<div id="printContent">要打印的内容区域<div>
<script type="text/javascript">
$(function(){
$("btnPrint").click(function(){ $("printContent").printArea(); });
});
</script>
②js打印
function preview(oper)
{
if (oper < 10){
bdhtml=window.document.body.innerHTML;//获取当前页的html代码
sprnstr="<!--startprint"+oper+"-->";//设置打印开始区域
eprnstr="<!--endprint"+oper+"-->";//设置打印结束区域
prnhtml=bdhtml.substring(bdhtml.indexOf(sprnstr)+18); //从开始代码向后取html
prnhtml=prnhtml.substring(0,prnhtml.indexOf(eprnstr));//从结束代码向前取html
window.document.body.innerHTML=prnhtml;
window.print();
window.document.body.innerHTML=bdhtml;
} else {
window.print();
}
}
将页面内要打印的内容加入中间<!--startprint1-->XXXXX<!--endprint1-->
再加个打印按纽 οnclick=preview(1)
以下为jquery.PrintArea.js的代码
(function ($) { var printAreaCount = 0; $.fn.printArea = function () { var ele = $(this); var idPrefix = "printArea_"; removePrintArea(idPrefix + printAreaCount); printAreaCount++; var iframeId = idPrefix + printAreaCount; var iframeStyle = 'position:absolute;width:0px;height:0px;left:-500px;top:-500px;'; iframe = document.createElement('IFRAME'); $(iframe).attr({ style: iframeStyle, id: iframeId }); document.body.appendChild(iframe); var doc = iframe.contentWindow.document; $(document).find("link").filter(function () { return $(this).attr("rel").toLowerCase() == "stylesheet"; }).each( function () { doc.write('<link type="text/css" rel="stylesheet" href="' + $(this).attr("href") + '" >'); }); doc.write('<div class="' + $(ele).attr("class") + '">' + $(ele).html() + '</div>'); doc.close(); var frameWindow = iframe.contentWindow; frameWindow.close(); frameWindow.focus(); frameWindow.print(); } var removePrintArea = function (id) { $("iframe#" + id).remove(); }; })(jQuery);