javascript - Trying to create a print page that only shows 3 divs -


I am trying to write a code that hides all the elements of a page in addition to three divs. This is because people will have a friendly version of the printer. I wrote it in jQuery but (this is political with our vendor) it will not work.

Here is the code:

  & lt; Script type = 'text / javascript' & gt; Function prints () {document.getElementsByTagName ("body"). Style.display = "none"; Document.getElementById ("hider"). Style.display = "inline"; Document.getElementById ("hider1"). Style.display = "inline"; Document.getElementById ("hider2"). Style.display = "inline"; }; & Lt; / Script & gt;   

When clicking on a button called the print function, I have been able to create a Divis Display but everything is not working to rotate. Any ideas?

I think I am using getElementsByTagName incorrectly, but I am unsure.

you is getElementsByTagName incorrectly ( It returns a node list , which does not contain the style property), but this is just stopping your one separate problem: if you have body , it does not matter if you inside body , it will not be shown.

This is done better with CSS using print style sheets: print

Whatever I want to do, I use a class to hide anything that you do not want to print. In fact, I'm known to use two classes: print and no-print . Print means "I only want to print it" and no-print means "I only want to see it when not Printing " Both the screen and the printing are shown on which the item does not contain one class or the other. You only use this with the top-level of the question.

The rules look like this:

  @ media is not printed {print. {Display: none; }} @ Media print {.no-print {display: none; }}   

Example:

  & lt ;! DOCTYPE html & gt; & Lt; Html & gt; & Lt; Top & gt; & Lt; Meta charset = "UTF-8" & gt; & Lt; Title & gt; Example & lt; / Title & gt; & Lt; Style & gt; Do not print @ media. Print {display: none; }} @ Media print {.no-print {display: none; }} & Lt; / Style & gt; & Lt; / Head & gt; & Lt; Body & gt; & Lt; P & gt; On-screen and print & lt; / P & gt; & Lt; P class = "print" & gt; Only shows when printing & lt; / P & gt; & Lt; P class = "no-print" & gt; Only shows when & lt; Strong & gt; No & lt; / Strong> Print & lt; / P & gt; & Lt; / Body & gt; & Lt; / Html & gt; On the screen, you can see it:  
 shows both on-screen and when printing shows during printing  

While printing, you see this:

 Both display on screen and when only showing the print  

Note the strong element in the example. Its visibility is determined by its container.

Comments

Popular posts from this blog

ios - Adding an SKSpriteNode to SKScene from a child SKSpriteNode -

Matlab transpose a table vector -

c# - Textbox not clickable but editable -