Home Web Front-end JS Tutorial Various front-end printing methods on the web: jquery printing plug-in PrintArea realizes web page printing_jquery

Various front-end printing methods on the web: jquery printing plug-in PrintArea realizes web page printing_jquery

May 16, 2016 pm 05:44 PM

The first step:
jquery.PrintArea.js download
js reference
Copy code The code is as follows:

<script language="javascript" src="jquery-1.7.1.min.js"></ script>
<script type="text/javascript" src="jquery.PrintArea.js"></script>

html quote :
Copy code The code is as follows:

<div class="my_show">
This is displayed when printing.
</div>
<div class="my_hidden">
This is hidden when printing.
</div>
<input type="button" id="print"/>

javascript code:
Copy code The code is as follows:

$(document).ready(function(){
$(" #print").click(function(){
$(".my_show").printArea();
});
});

This plug-in also It provides some configurable parameters. The method used is: $(element).printArea(option).
I have never used this method myself. Please try it. Please leave a message if you have any questions.

Parameter settings:
1.mode: mode, the mode is triggered when the print button is clicked, the default is iframe, when set to popup, a new window page will be opened for printing.
2.popTitle: Set the title of the newly opened window, which is empty by default.
3.popClose: Whether to close the window after completing printing, the default is false.
Statement of this Website
The content of this article is voluntarily contributed by netizens, and the copyright belongs to the original author. This site does not assume corresponding legal responsibility. If you find any content suspected of plagiarism or infringement, please contact admin@php.cn

Hot Article

Hot Article

Hot Article Tags

Notepad++7.3.1

Notepad++7.3.1

Easy-to-use and free code editor

SublimeText3 Chinese version

SublimeText3 Chinese version

Chinese version, very easy to use

Zend Studio 13.0.1

Zend Studio 13.0.1

Powerful PHP integrated development environment

Dreamweaver CS6

Dreamweaver CS6

Visual web development tools

SublimeText3 Mac version

SublimeText3 Mac version

God-level code editing software (SublimeText3)

Replace String Characters in JavaScript Replace String Characters in JavaScript Mar 11, 2025 am 12:07 AM

Replace String Characters in JavaScript

jQuery Check if Date is Valid jQuery Check if Date is Valid Mar 01, 2025 am 08:51 AM

jQuery Check if Date is Valid

jQuery get element padding/margin jQuery get element padding/margin Mar 01, 2025 am 08:53 AM

jQuery get element padding/margin

Top 5 Date Manipulation JS Plugins Top 5 Date Manipulation JS Plugins Feb 28, 2025 am 12:34 AM

Top 5 Date Manipulation JS Plugins

10 jQuery Accordions Tabs 10 jQuery Accordions Tabs Mar 01, 2025 am 01:34 AM

10 jQuery Accordions Tabs

10 Worth Checking Out jQuery Plugins 10 Worth Checking Out jQuery Plugins Mar 01, 2025 am 01:29 AM

10 Worth Checking Out jQuery Plugins

jquery add scrollbar to div jquery add scrollbar to div Mar 01, 2025 am 01:30 AM

jquery add scrollbar to div

HTTP Debugging with Node and http-console HTTP Debugging with Node and http-console Mar 01, 2025 am 01:37 AM

HTTP Debugging with Node and http-console

See all articles