Wydrukuj zawartość DIV przez JQuery

Załóżmy, że mam wiele elementów div na mojej stronie, ale chcę wydrukować zawartość określonego elementu div przy użyciu jquery. znalazłem tam wtyczkę do tego.Wydrukuj zawartość DIV przez JQuery

jQuery Print Element

za pomocą tej wtyczki możemy łatwo wydrukować zawartość div jak poniżej.

$('SelectorToPrint').printElement();

ale co się stanie, jeśli mój div jest ukryty na stronie. więc to działa. ta wtyczka może wydrukować zawartość ukrytego elementu div?

co się stanie, jeśli drukarka nie jest podłączona do komputera klienta. Chcę wyświetlić komunikat, jeśli nie ma drukarki do klienta, że "Nie znaleziono drukarki"? jak poradzić sobie z tą sytuacją. więc proszę doradzić mi, jakie byłoby najlepsze podejście do drukowania zawartości ukrytego elementu div na stronie, a także obsługi problemu z drukarką, jeśli drukarka nie jest podłączona.

dzięki

Źródło

2011-09-23 Keith Costa

byłaś nawet próbował go używać? – Jack

ukryty element div nie jest drukowany za pomocą wtyczki http://projects.erikzaadi.com/jQueryPlugins/jQuery.printElement/ –

Twoje pytanie nie brzmi jak jeśli nawet nie próbował go samodzielnie, więc nie powinien nawet myśleć o odpowiadając, ale: czy ukryty div nie mogą być drukowane z tej jednej linii:

$('SelectorToPrint').printElement();

wystarczy zmienić go:

$('SelectorToPrint').show().printElement();

który powinien działać we wszystkich przypadkach.

dla reszty, nie ma rozwiązania. wtyczka otworzy okno dialogowe drukowania dla ciebie, gdzie użytkownik musi wybrać swoją drukarkę. po prostu nie możesz dowiedzieć się, czy drukarka jest podłączona do javascript (a ty (prawie) nie możesz drukować bez okna dialogowego drukowania - jeśli myślisz o tym).

UWAGA:

Przedmiotem $.browser został usunięty w wersji 1.9.x jQuery podejmowania tej biblioteki obsługiwane.

Źródło

2011-09-23 14:14:54 oezi

Istnieje sposób użycia tego z ukrytym div, ale musisz pracować trochę więcej za pomocą funkcji printElement() i css.

CSS:

#SelectorToPrint{ 
    display: none; 
}

Scenariusz:

$("#SelectorToPrint").printElement({ printBodyOptions:{styleToAdd:'padding:10px;margin:10px;display:block', classNameToAdd:'WhatYouWant'}})

ten zastąpi display: none w nowym oknie otwierania, a zawartość zostanie wyświetlona na stronie druku, podgląd i div na Twojej stronie pozostaje ukryta.

Źródło

2013-02-19 10:26:05 user2086598

spróbować tej biblioteki jQuery, jQuery Print Element

http://projects.erikzaadi.com/jQueryPlugins/jQuery.printElement/

Źródło

2013-03-25 09:36:52

Wolę ten jeden, ja testowałem to i jego pracy

https://github.com/jasonday/printThis

$("#mySelector").printThis();

lub

$("#mySelector").printThis({ 
*  debug: false,    * show the iframe for debugging 
*  importCSS: true,   * import page CSS 
*  printContainer: true,  * grab outer container as well as the contents of the selector 
*  loadCSS: "path/to/my.css", * path to additional css file 
*  pageTitle: "",    * add title to print page 
*  removeInline: false  * remove all inline styles from print elements 
* });

Źródło

2013-08-08 00:22:53

można wykonać następujące kroki:

owinąć div chcesz wydrukować w innym div.
Ustaw status wyświetlania opakowania dziobkowego na none w css.
zachowaj element div, który chcesz wydrukować status wyświetlania jako blok, w każdym razie zostanie ukryty, ponieważ jego element nadrzędny jest ukryty.
prostu zadzwonić $('SelectorToPrint').printElement();

Źródło

2014-04-24 14:05:56 user826876

Oto rozwiązania JQuery & JavaScript, żeby wydrukować div za nim stylów (CSS wewnętrzne i zewnętrzne)

$(document).ready(function() { 
      $("#btnPrint").live("click", function() {//$btnPrint is button which will trigger print 
       var divContents = $(".order_summery").html();//div which have to print 
       var printWindow = window.open('', '', 'height=700,width=900'); 
       printWindow.document.write('<html><head><title></title>'); 
       printWindow.document.write('<link rel="stylesheet" href="//netdna.bootstrapcdn.com/bootstrap/3.1.0/css/bootstrap.min.css" >');//external styles 
       printWindow.document.write('<link rel="stylesheet" href="/css/custom.css" type="text/css"/>'); 
       printWindow.document.write('</head><body>'); 
       printWindow.document.write(divContents); 
       printWindow.document.write('</body></html>'); 
       printWindow.document.close(); 

       printWindow.onload=function(){ 
       printWindow.focus();           
       printWindow.print(); 
       printWindow.close(); 
       } 
      }); 
});

To wydrukować div w nowym oknie.

przycisku wywołać zdarzenie

<input type="button" id="btnPrint" value="Print This">

Źródło

2017-05-20 06:12:09 CyberAbhay

Wydrukuj zawartość DIV przez JQuery

Odpowiedz

Powiązane problemy