2014-03-24 2 views
0

Я пробовал следующее:Как распечатать содержимое всплывающее окно

<button onclick="window.print()" class="uk-button uk-float-left"><?php echo JText::_('COM_CSTUDOMUS_IMPRIMIR'); ?></button> 

также:

self.print()

window.focus(); window.print ()

Когда я нажимаю на печать, отображается главное окно и всплывающее окно на странице, которая будет напечатана д. Мне нужно только содержимое всплывающего окна.

+0

Вы используете какой-то всплывающий фреймворк (т. Е. Fancybox и т. Д.)? –

ответ

3

Это пример печати всплывающего окна:

<div class="contentSection"> 
    <div class="contentToPrint"> 
     <!-- content to be printed here --> 
    </div> 
</div> 

<div class="contentSection"> 
    <a href="#" id="printOut">Print This</a> 
</div> 

<div class="contentSection termsToPrint"> 
    <h4>Terms & conditions</h4> 
    <p>Management reserves the right to withdraw, amend or suspend this print job in the event of any unforeseen circumstances outside its reasonable control, with no liability to any third party.</p> 
</div> 

<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.5.0/jquery.min.js"></script> 

<script type="text/javascript"> 
    $(function(){ 
     $('#printOut').click(function(e){ 
      e.preventDefault(); 
      var w = window.open(); 
      var printOne = $('.contentToPrint').html(); 
      var printTwo = $('.termsToPrint').html(); 
      w.document.write('<html><head><title>Copy Printed</title></head><body><h1>Copy Printed</h1><hr />' + printOne + '<hr />' + printTwo) + '</body></html>'; 
      w.window.print(); 
      w.document.close(); 
      return false; 
     }); 
    }); 
</script> 
1
//popup page 
    <html> 
     <head> 
     <title>Your popup</title> 
     </head> 
     <body> 

     <h1>Pop</h1> 
     <p>Print me</p> 
     <a href="print.html" onclick="window.print();return false;"> 
      <img src="images/printer.png" height="32px" width="32px"> 
     </a> 

     </body> 
     </html> 

//Main page 
    <html> 
     <head> 
     <title>main</title> 
     </head> 
     <body> 

     <h1>Pop & print</h1> 
     <button onclick="pop();">Pop</button> 
     <script type="text/javascript"> 
      var POP; 
      function pop() { 
      POP = window.open('popup.html', 'thePopup', 'width=350,height=350'); 
      } 
     </script> 

     </body> 
     </html> 
0

Вы можете использовать свойство CSS media:

@media print 
{ 
    .no-print { display: none; } 
    .print { display: block; } 
} 

Просто создать оболочку с no-print класса для главного окна и print класс для всплывающего окна.

Смежные вопросы