2010-01-31 6 views
0

Je vais essayer d'expliquer:* Multiple * Imprimer spécifique Div

J'ai de nombreuses classes div, mais pour des raisons de simplicité, disons que je n'ai que 3.

Quelqu'un consulte DIV 1, et je veux leur donner l'option de seulement imprimer DIV 1, en omettant 2 et 3.

Cependant, sur la même page, je voudrais leur donner l'option d'IMPRIMER SEULEMENT DIV 2. Ou seulement imprimer DIV 3.

Je pense que je comprends comment vous pouvez omettre certaines choses de s'imprimer. Mais comment pouvez-vous sélectionner une section ici ou là sur la même page à imprimer avec un lien d'impression.

Merci, Tracy

+0

voulez-vous imprimer le div sélectionné et les environs ou juste le petit contenu divs lui-même? –

Répondre

0

Vous pouvez utiliser jQuery pour afficher/masquer divs. Lire le tutoriel jQuery:

http://docs.jquery.com/Tutorials

Le code ressemblera à ceci:

<script> 
function showDiv(n) { 
    $('.divs').hide(); 
    $('#div_'+n).show(); 
} 
$(document).ready(function() { showDiv(1); }); 
</script> 
<a href='javascript:showDiv(n)'>show div n</a> 
<div class='divs' id='div_n'>I'm div n</div> 
+0

Oui, je suis conscient de comment afficher/masquer les divs, mais comment imprimez-vous des divs spécifiques? – flipflopmedia

0

Il y a beaucoup de messages connexes sur le contenu div d'impression, cette question particulière était encore ouverte mais il a été demandé à ' 10 .. La fonction JavaScript suivante peut être utilisée pour imprimer le contenu d'une variable Div sélectionnée. J'espère que cela t'aides. Declaimer: J'ai utilisé certaines des réponses existantes, corrigé/amélioré code/erreur (s) pour travailler avec (et testé sur) IE-8.

function printDiv(divName) { 
    var divToPrint = document.getElementById(divName); 
    var newWin = window.open('', 'PrintWindow', 'width=400, height=400, top=100, left=100', ''); 
    newWin.document.open(); 
    newWin.document.write('<html><body onload="window.print()">' + divToPrint.innerHTML + '</body></html>'); 
    newWin.document.close(); 
    setTimeout(function() { newWin.close(); }, 10); 
} 

Appelez printDiv à partir de n'importe où dans la page ou à partir de Div. Voici le lien de test:

<a href="Javascript:printDiv('divCustomerData')">Print Customer Data</a> 

<a href="Javascript:printDiv('divOrderData')">Print Order Data</a> 

attribuer des ID respectifs à la division qui est à imprimer:

<div id="divCustomerData">Div Contents goes here... </div> 

Le seul hic est en ce moment il perd des styles css. Je mettrai à jour la réponse quand j'aurai l'occasion de la réparer. Merci.

+0

Juste curieux de savoir s'il y aurait un moyen d'ajouter à ce script et d'appeler votre page CSS à charger dans la nouvelle fenêtre? Je me trouve avoir besoin d'une réponse aujourd'hui, à ma question que j'ai posée il y a 71/2 ans! – flipflopmedia

+1

Peu importe, c'était assez facile. Je viens d'ajouter les balises de tête manquantes et ajouté la balise css et lié à celui-ci. – flipflopmedia

0

https://github.com/jasonday/jquery.printThis

je donner à chaque div un id, puis en utilisant le plug-in ci-dessus (je l'ai écrit) préciser selon div id.

+0

Oui, beaucoup d'années se sont écoulées depuis que j'ai posté cette question. Je me suis retrouvé à chercher la même réponse aujourd'hui. Je voulais juste mentionner que votre URL a changé sur votre site à partir de ce que vous avez posté, à: https://github.com/jasonday/printThis – flipflopmedia

Questions connexes