Hogyan szabhatók a böngésző kimenet print / nyomtatási kép?

szavazat
8

Próbálom dinamikusan elrejteni bizonyos DIV-es, amikor a print (vagy nyomtatási kép) akkor a böngésző.

Én könnyen megkülönböztetni statikusan, hogy két stíluslapok, egy normál és egy nyomtatott média:

De kell, hogy egy lépéssel tovább, és elrejteni bizonyos elemek dinamikus, amikor a nyomtatási stílus lap aktívvá válik a nyomtatás során alapul bizonyos feltételek

Az egyik módja annak, hogy könnyen megoldja lenne kezelni a DOM esemény kezelésére print / printview, akkor tudtam csak használni jQuery, hogy módosítsa a display: none az osztályok, amelyeket meg kell rejtve, de nem találom a DOM nyomtatási esemény !!

Bárki, aki tudja, mi a megoldás?

A kérdést 10/10/2008 13:15
a forrás felhasználó
Más nyelveken...                            


4 válasz

szavazat
1

Van egy onbeforeprint esemény IE. Úgy tűnik, nem támogatja a többi nagy böngésző. (Kipróbáltam Firefox 3.0.3 és 3.1.2 Safari).

Válaszolt 10/10/2008 13:22
a forrás felhasználó

szavazat
5

Nem minden böngésző lehetővé teszi, hogy rögzítse a nyomtatási esemény. Láttam már ezt kezelni hozzáadásával „oldal nyomtatása” linkre, majd használja ezt a click esemény elérni, amire szüksége van.

Válaszolt 10/10/2008 13:24
a forrás felhasználó

szavazat
4

Csak címkézni azokat DIVs egy osztályt, ami rejtve a nyomtatási stíluslap:

HTML

<div id='div19' class='noprint'>
  ...
</div>

print.css

.noprint {
  display: none;
}

Ha nem tudja előre, milyen elemeket kell rejteni, akkor beállításához javascript az osztály az adott tárgyak:

Javascript

document.getElementById('div19').className='noprint';
Válaszolt 10/10/2008 14:20
a forrás felhasználó

szavazat
5

Nem hiszem, hogy szükség van egy nyomtatási esemény. Mindössze annyit kell tennie, hogy módosítsa a @media printstílusok alapján a Javascript (?) Kritériumoknak. Amikor a felhasználó megpróbálja kinyomtatni az oldalt, a @media printstílus lesz érvényes, és a stílusok lesznek érvényben:

<html>
<head>
<style id="styles" type="text/css">
@media print { .noprint { display:none; } }
</style>
<script type="text/javascript">
var x = Math.random();

if (x > .5) {
    var style = document.createElement('style');
    style.type = 'text/css';
    style.innerHTML = '@media print { .maybe_noprint { display:none; } }';
    document.getElementsByTagName('head')[0].appendChild(style);
}
</script>
</head>
<body>
<div class="noprint">This will never print.</div>
<span class="maybe_noprint">This may print depending on the value of x.</span>
</body>
</html>

Ha ön használ szerver oldali kritériumok annak meghatározására, hogy mit nyomtat, akkor csak azt a szerver oldali kód kiköp @media printdíszíteni az osztályok, ha szükséges. Is, akkor lehet, hogy érdemes egy már meglévő átalakítása osztályt, ami már benne @media printvan, vagy kiépítése az új CSS segítségével valami más, mint innerHTML, amit én elismerem szaga szörnyű nekem, de úgy tűnik, működik az Opera 9.6, Safari for Windows 3.1.2 , IE 6 és Firefox 2.0.0.17 (én nem teszteltem más böngészők).

Válaszolt 10/10/2008 21:06
a forrás felhasználó

Cookies help us deliver our services. By using our services, you agree to our use of cookies. Learn more