jQuery controls the way a web page prints a specified area

  • 2020-05-27 04:14:07
  • OfStack

This article illustrates an example of how jQuery controls the printing of a specified area of a web page. Share with you for your reference. The specific analysis is as follows:

Use jQuery to control the page to print the specified area, you can specify an id of an div area to print part of the page, as shown in the following code:


<html>
<head>
<title>jquery  Print the contents of the specified area </title>
<script src="js/jquery-1.7.2.min.js"></script>
<script type="text/javascript">
function printHtml(html) {
var bodyHtml = document.body.innerHTML;
document.body.innerHTML = html;
window.print();
document.body.innerHTML = bodyHtml;
}
function onprint() {
var html = $("#printArea").html();
printHtml(html);
}
</script>
</head>
<body>
<div>
<div id="printArea" 
style="width: 500px; text-align: left;">
 Print area ~~~~
</div>
<br />
<div>
<input type="button" id="btnPrint" 
onclick="onprint()" value="print" />
</div>
</div>
</body>
</html>

I hope this article has been helpful to your jQuery programming.


Related articles: