打印当前HTML页面的onclick

Question

我需要使用按钮属性在新的一页打印当前HTML页的“onClick（）”我用了follwing

javascript 
 
function printPartOfPage(elementId) 
 
{ 
 
var printContent = document.getElementById(elementId); 
 
var windowUrl = 'P2P Money Transfer'; 
 
var uniqueName = new Date(); 
 
var windowName = 'P2P Money Transfer -' + uniqueName.getTime(); 
 

 
var printWindow = window.open(windowUrl, windowName, 'left=50000,top=50000,width=0,height=0'); 
 

 
printWindow.document.write(printContent.innerHTML); 
 
printWindow.document.close(); 
 
printWindow.focus(); 
 
printWindow.print(); 
 
printWindow.close(); 
 
} 
 
</script>

<input type="button" value="Print" onclick="JavaScript:printPartOfPage('printDiv');" >

，但问题是有没有实现样式，所以我需要将当前整个html页面转换为方法，并使用其中包含所有样式的document.write（）进行编写。

Answer 1

我建议你用printThis jquery库来实现你的目标。

有了这个库可以打印的页面（例如一个div）的某些部分，并决定使用页面的CSS或外部CSS添加为参数。 这里的参数

$("#mySelector").printThis({ 
*  debug: false,    * show the iframe for debugging 
*  importCSS: true,   * import page CSS 
*  importStyle: false,   * import style tags 
*  printContainer: true,  * grab outer container as well as the contents of the selector 
*  loadCSS: "path/to/my.css", * path to additional css file - us an array [] for multiple 
*  pageTitle: "",    * add title to print page 
*  removeInline: false,  * remove all inline styles from print elements 
*  printDelay: 333,   * variable print delay 
*  header: null,    * prefix to html 
*  formValues: true   * preserve input/form values 
* }); 

正如你可以看到，该场所importStyle，如果你把它设置为true脚本加载页面的相同的脚本列表。您也可以使用属性loadCSS加载外部CSS。

我已经使用它，它运作良好。

看this小提琴为例