jQuery.print is a plugin for printing certain parts of a page. Print is an easy and simple jQuery plugin that allows the visitor to print only the selected region of your web page.
jquery print section of page, print another page using jquery, jquery print div, jquery print page number, jquery print popup window, jquery print div with css
How to make use of it:
1. Specify a distinctive ID to your HTML aspect and the place you wish to make it printable.
<div id="printable"> Your Content </div>
2. Create a button to print the required HTML aspect.
<button class="print"> Print this </button>
3. Import the newest jQuery library and jQuery print plugin.
<script src="/path/to/cdn/jquery.min.js"></script> <script src="/path/to/jQuery.print.js"></script>
. Call the plugin on the print button and accomplished.
$(function() { $("#printable").find('.print').on('click', function() { $.print("#printable"); }); });
5. Available plugin settings.
$("#printable").print({ // Use Global styles globalStyles : false, // Add link with attrbute media=print mediaPrint : false, //Custom stylesheet stylesheet : "https://fonts.googleapis.com/css?family=Inconsolata", //Print in a hidden iframe iframe : false, // Don't print this noPrintSelector : ".avoid-this", // Add this on top append : "<br/>", // Add this at bottom prepend : "<br/>", // Manually add form values manuallyCopyFormValues: true, // resolves after print and restructure the code for better maintainability deferred: $.Deferred(), // timeout timeout: 250, // Custom title title: null, // Custom document type doctype: '<!doctype html>' });
Currently, this plugin supports the following options:
globalStyles
- Default:
true
- Acceptable-Values: Boolean
- Function: Whether or not the styles from the parent document should be included
mediaPrint
- Default:
false
- Acceptable-Values: Boolean
- Function: Whether or not link tags with media=’print’ should be included; Over-ride by the
globalStyles
option
stylesheet
- Default:
null
- Acceptable-Values: URL-string or Array of URL-strings
- Function: URL of an external stylesheet to be included
noPrintSelector
- Default:
".no-print"
- Acceptable Values: Any valid
jQuery-selector
- Function: A selector for the items that are to be excluded from printing
iframe
- Default:
true
, creates a hidden iframe if a no-valid iframe selector is passed - Acceptable Values: Any valid
jQuery-selector
or Boolean - Function: Whether to print from an iframe instead of a pop-up window; can take the
jQuery-selector
of an existing iframe as value
append/prepend
- Default:
null
- Acceptable Values: Any valid
jQuery-selector
or HTML-text - Function: Adds custom HTML before (prepend) or after (append) the selected content
manuallyCopyFormValues
- Default:
true
- Acceptable-Values: Boolean
- Function: Should it copy user-updated form input values onto the printed markup (this is done by manually iterating over each form element)
deferred
- Default:
$.Deferred()
- Acceptable Values: Any valid
jQuery.Deferred
object - Function: A jQuery.A deferred object is resolved once the print function is called. Can be used to set up callbacks.
timeout
- Default:
750
- Acceptable-Values: Time in Milliseconds for
setTimeout
- Function: To change the amount of max time to wait for the content, etc to load before printing the element from the new window/iframe created, as a fallback if the
load
event for the new window/iframe has not fired yet
title
- Default:
null
, uses the host page title - Acceptable-Values: Any single-line string
- Function: To change the printed title
doctype
- Default:
'<!doctype html>'
- Acceptable-Values: Any valid doctype string
- Function: To prepend a doctype to the printed document frame
jQuery Plugin To Print Any Part Of Your Page, jQuery Print Plugin/Github, jquery print div with bootstrap, jquery print preview
See Demo And Download
Official Website(DoersGuild): Click Here
This superior jQuery/javascript plugin is developed by DoersGuild. For extra Advanced Usage, please go to the official website.