See the name of this plugin, can you guess what it is used for?
Jquery. Printarea.js is a Web page can be printed on the plug-in, practical method is very simple.
Here is a brief description of how it is used.
1, save 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);
2. Call Jquery.min.js and Jquery.PrintArea.js
3, call the PrintArea () method.
Here is the simple code section:
<div class= "My_show" >
<p> Precautions:</p>
<p>1, candidates must be brought together with the admission ticket, ID card, before entering the examination room. </P>
<P>2, Examinee-owned rubber, 2B pencil, black handwriting pen, signature pen or ballpoint pen. </P>
<p>3, prohibit the pager, mobile phone, electronic Notepad, calculator and other electronic equipment to the examination room. </P>
<p>4, 30 minutes before the examination can enter the examination room, the examination began 30 minutes after the admission, not in advance examination, exit. </P>
<p>5, strictly prohibit the answer card, Libon, test papers, grass paper, etc. take out of the examination room. </P>
<p>6, candidates must abide by the rules of the examination room, if there is cheating, will be disqualified. </P>
</div>
<button class= "Print" > Print </button>
As shown above, place what needs to be printed in a Div, and then call the Print method when you click on the Print button. As follows:
$ (. Print). Click (function () {
$ (". My_show"). PrintArea ();
});
This will enable you to do the printing function, you can try it with interest.