Turn JS Print

Source: Internet
Author: User
Tags print print

JS Print

JavaScript Web page Printing Daquan

Normal printing (full page) print part content (custom) Print out page/Add header footer Use external controls/methods for multi-function print print backgrounds

The above is code control

Set page setup for printing parameter settings (Window System graphics)

One, ordinary printing (full page dozen)
It's not much to say, just use it.


Citation: Window.print ();

Second, print part of the content in the Web page (custom)

Implemented in three different ways
1, with CSS control

Reference: @media Print
. a {Display:block}
. b {Display:hidden}
Set the part of class that you don't want to print to B
First add to the page:

Reference: <object id= "WebBrowser" height= "0" width= "0" classid= "CLSID:8856F961-340A-11D0-A96B-00C04FD705A2"
Viewastext>
</OBJECT>
You can then add the function button in turn:


Reference: <input type= "button" value= "print" > <input type= "button" value= "Direct print" >
<input type= "button" value= "Page Setup" >
<input type= "button" value= "Print Preview" > <input type= "button" value= "Close Window" >
Put these two things into <center class= "noprint" ></center> will not print these buttons. Of course to define the Noprint:
<style media= "Print";. noprint {Display:none}</style> just set the CSS of what you don't want to print to noprint.
Now that basic Web printing is implemented, you need to be aware of the following:
A. An ActiveX control that is not marked as safe must be made in the security settings of Internet Options for IE. Set to prompt or enable, otherwise it will error, resulting in unavailability.
B. If you edit the page in the Vs.net editing environment, it often automatically adds extra parameters to the object, and with these things, the print will go wrong, so remember to delete them when you last save.

2. Use JavaScript to print content in fixed tags
A. Add JavaScript to the page's code head:


Reference: <script language=javascript>
function Doprint () {
bdhtml=window.document.body.innerhtml;
Sprnstr= "<!--startprint-->";
Eprnstr= "<!--endprint-->";
Prnhtml=bdhtml.substr (Bdhtml.indexof (SPRNSTR) +17);
Prnhtml=prnhtml.substring (0,prnhtml.indexof (EPRNSTR));
window.document.body.innerhtml=prnhtml;
Window.print ();
}
</script>


2. Add <!--startprint--> and <!--endprint--> logo to the body of the page.

That is, the HTML attached to the text where the user needs to print the saved body. At the same time, if the thief program to obtain remote data and to print, such data can be placed within the definition tag.

3, the interception content part has been completed, now add a "print" Link:

xml/html Code
<a href= "javascript:;" onclick= "Doprint ()" > Printing </a>

Reference:
<script language= "JavaScript" >
var Hkey_root,hkey_path,hkey_key
Hkey_root= "HKEY_CURRENT_USER"
Hkey_path= "\\Software\\Microsoft\\Internet explorer\\pagesetup\\"
Set page header footer to print is empty
function Pagesetup_null () {
try{
var regwsh = new ActiveXObject ("Wscript.Shell")
Hkey_key= "Header"
Regwsh.regwrite (Hkey_root+hkey_path+hkey_key, "")
hkey_key= "Footer"
Regwsh.regwrite (Hkey_root+hkey_path+hkey_key, "")
}catch (e) {}
}
Set the page header footer to print to the default value
function Pagesetup_default () {
try{
var regwsh = new ActiveXObject ("Wscript.Shell")
Hkey_key= "Header"
Regwsh.regwrite (Hkey_root+hkey_path+hkey_key, "&w&b page, &p/&p") hkey_key= "Footer"
Regwsh.regwrite (Hkey_root+hkey_path+hkey_key, "&u&b&d")
}catch (e) {}
}
</script>
<input type= "button" value= "empty page number" Onclick=pagesetup_null () >
<input type= "button" value= "Recover page number" Onclick=pagesetup_default () >


Copy it out and look at the effect.

(iv) Use of external controls/methods for multi-function printing

1. Iewebbrowser Components

Introduced
Http://support.microsoft.com/default.aspx?scid=kb%3BEN-US%3BQ267240#top
http://support.microsoft.com/kb/q247671/#appliesto

Code


Reference: <object classid=clsid:8856f961-340a-11d0-a96b-00c04fd705a2 height=0 id=webbrowser width=0></OBJECT>
<input Name=button ONCLICK=DOCUMENT.ALL.WEBBROWSER.EXECWB (a) Type=button value= open >
<input Name=button ONCLICK=DOCUMENT.ALL.WEBBROWSER.EXECWB (2,1) Type=button value= Close all >
<input Name=button ONCLICK=DOCUMENT.ALL.WEBBROWSER.EXECWB (4,1) Type=button value= Save As >
<input Name=button ONCLICK=DOCUMENT.ALL.WEBBROWSER.EXECWB (6,1) Type=button value= print >
<input Name=button ONCLICK=DOCUMENT.ALL.WEBBROWSER.EXECWB (6,6) Type=button value= Direct Printing >
<input Name=button ONCLICK=DOCUMENT.ALL.WEBBROWSER.EXECWB (7,1) Type=button value= Print Preview >
<input Name=button ONCLICK=DOCUMENT.ALL.WEBBROWSER.EXECWB (8,1) Type=button value= Page setup >
<input Name=button ONCLICK=DOCUMENT.ALL.WEBBROWSER.EXECWB (10,1) Type=button value= properties >
<input Name=button ONCLICK=DOCUMENT.ALL.WEBBROWSER.EXECWB (17,1) Type=button value= Select All >
<input Name=button ONCLICK=DOCUMENT.ALL.WEBBROWSER.EXECWB (22,1) Type=button value= Refresh >
<input Name=button ONCLICK=DOCUMENT.ALL.WEBBROWSER.EXECWB (45,1) Type=button value= close >

2. Using the Scriptx.cab control


1. Download Scriptx.cab controls

Official website http://www.meadroid.com/scriptx/index.asp

2. Use the object element to modify the value of the Codebase,classid

This invokes the control Scriptx.cab

Code


Reference:
<object id= "Factory" style= "Display:none" codebase= "${rooturl}js/smsx.cab#vversion=6,3,435,20" classid= "clsid : 1663ed61-23eb-11d2-b92f-008048fdd814 "viewastext></object>

This code is used to load the CAB file, and the CLSID and codebase must correspond to the information in the cab you downloaded, otherwise the component will load the error, these two are actually not difficult to find, as long as you use WinRAR to open the CAB file you downloaded, Then find the file with the extension. inf, and then open it and you can see it.

3. Invoking control scripts

Print.js file
Code

Reference:

function Setprintbase (headertext,footertext,rooturl) {

--advanced features, never used, pending confirmation.

Factory.printing.SetMarginMeasure (2); Measure margins in inches

Factory. Setpagerange (False, 1, 3);//need pages from 1 to 3

Factory.printing.printer = "HP DeskJet 870C";

Factory.printing.copies = 2;

Factory.printing.collate = true;

Factory.printing.paperSize = "A4";

Factory.printing.paperSource = "Manual feed"

var header = (headertext==null| | headertext== "")? ' Default header ': HeaderText;

var footer = (footertext==null| | footertext== "")? ' Default page angle ': footertext;

Factory.printing.header = "&b" +header+ "&b";

Factory.printing.footer = "&b" +footer;

Factory.printing.portrait = true;

Factory.printing.leftMargin = 10.00;

Factory.printing.topMargin = 10.00;

Factory.printing.rightMargin = 10.00;

Factory.printing.bottomMargin = 10.00;

}


Example

Reference:

<meta http-equiv= "Imagetoolbar" c>
<script language= "javascript" src= "Print.js" ></script>
<style media= "Print" >
. noprint {display:none;}
</style>
<title> Print Test </title>
<object id= "Factory" style= "Display:none" codebase= "smsx.cab#vversion=6,3,435,20" classid= "clsid : 1663ed61-23eb-11d2-b92f-008048fdd814 "viewastext></object>

<script defer>
function Window.onload () {
Setprintbase (' header ', ' footer ');
}
</script>
<body topmargin= "0" leftmargin= "0" rightmargin= "0" bottommargin= "0" marginwidth= "0" marginheight= "0" >
<center class= "Noprint" >
<input Type=button value= "Print" >
<input Type=button value= "Page Setup" >
<input Type=button value= "Print Preview" >
<input type= "button" value= "Off" >
</center>
<center>
<table width= "100%" border= "0" cellpadding= "0" cellspacing= "0" >
&LT;TR&GT;&LT;TD align= "Center" ><b> content </b></td></tr>
</table>
</center>
</body>

(v) Print background
By default, when you print a Web page by using Internet Explorer, the page background is not printed. If you need to print the background of a Web page, you can set the following methods:
1. Start IE browser.
2. Select the Internet Options menu item in the Tools menu to open the Internet Options dialog box.
3. Open the Advanced tab and select the print background colors and images check box in the print selection.
4. Click the OK button to close the dialog box.

(vi) How to print Web pages with IE


Internet Explorer (IE) more than 5.0 version of the powerful print and print preview features. This article will introduce you how to use IE to print Web pages. Who Who? Who's throwing tomatoes? The following is a hiss: This still uses you to speak?! Cough, yes, it's too easy to print a Web page in IE. Just click on the "Print" button on the toolbar to print out the current page. As shown in the following:


But what about the effect of your beating? I wouldn't dare to say it. What I want to talk to you about today is some of the setup parameters for printing. How do you set these parameters, you will find that the IE printing function quickly catch up with word. In the future, you can print a webpage and you will be able to hit it. Well, talk less, now come with me to see how to set the printing parameters of IE.
Let's take a look at the list of students we want to print (the Student Status management System MX query results webpage) to illustrate how to set these print parameters:


If we print this page directly from the "Print" button on the toolbar or from "Print" in the "File" menu, we will print out a lot of unnecessary information. So before we print, we should first use the IE5 new Print preview feature to see how the current page actually prints. As shown in the following:


In the Print Preview dialog box shown, we can see that the page title, URL address of the webpage, and the date of the printing are printed out as well as the information we don't need. and the page number is in the upper right corner, can you move it to another location (like our common lower-right corner)?


Can we print the page in the style we want? Of course. It's all in "Page Setup."


Pop up as shown in the "Page Setup" dialog box, all the secrets are here!


    It turns out that IE automatically adds these unnecessary printing information to the header and footer. If we don't want any headers or footers, we can just delete them. :-) I do it most of the time. But what if you want to customize the header and footer? What does that mean by "&w&b&p" and so on? I'll give you a form to find out. Meaning  
&w page title
&u page address (URL)
&d Short Date format (specified by Regional Settings in Control Panel)
&d Long date format (specified by Regional Settings in Control Panel) Br>&t the time format specified by regional Settings in Control Panel
&t 24 hour time format
&p current page
&p total pages        
&b Text to the right (please place the text you want to right-aligned after "&b")
&b&b text centered (place the text you want to center between &b and &b)
&& Single & (&)
Note: 1, these symbols can be used in combination with text, such as "page number, &p/&p" in this tutorial.
    2, headers and footers are left-aligned by default, so IE only provides right-aligned and centered set symbols.
    3, recommend a way to set up: The header is empty, the footer is set to "&b page &p/&p page &b", the result is the effect of "1th page/Total 4 pages" in the center of the footer.
    Knowing the knowledge above, you can print it. But sometimes you'll find that some of the images in the page are missing when you print. Why? Why is that? Don't worry, IE's default setting is not to print the background color and image of the Web page. You just have to go to IE's Internet option to select it (tick). How to do this: Point IE's main menu, "Tools"--"Internet Options"--and then in the Pop-up dialog box, hit the "Advanced" tab, find "Print background color and image" one. As shown in the following:

Then tick the red-circled option, then click "OK" to OK.

At this point, we have completed the print settings for IE. Next, as long as we do not close ie, we can always use the above settings (the last "Print background color and image" Changes are always valid) to print. Print preview before printing, the effect is satisfied before you start printing.

3. Windows comes with features
Press and hold the left mouse button, select the content you want to print, then right-click to select "Print", and in the "page range" in the pop-up Print dialog box, choose "Selection" to print only the content of your choice.


Turn JS Print

Contact Us

The content source of this page is from Internet, which doesn't represent Alibaba Cloud's opinion; products and services mentioned on that page don't have any relationship with Alibaba Cloud. If the content of the page makes you feel confusing, please write us an email, we will handle the problem within 5 days after receiving your email.

If you find any instances of plagiarism from the community, please send an email to: info-contact@alibabacloud.com and provide relevant evidence. A staff member will contact you within 5 working days.

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.