Удаление окна ввода из предварительного просмотра печати

Question

Я пытаюсь показать окно ввода только при предварительном просмотре страницы, а не на главной странице. Я использую следующую функцию, чтобы получить предварительный просмотр печати:

function fnPrint() 
 
{ 
 
var prtContent = document.getElementById("colMain"); 
 
var WinPrint = window.open('', '', 'left=2px,top=2px,right=2px;height=auto;toolbar=0,scrollbars=1,status=0'); 
 
WinPrint.document.write(prtContent.innerHTML); 
 
WinPrint.document.write('<link rel="stylesheet" type="text/css" href="/common-media/styles/screen.css" />'); 
 
WinPrint.document.write('<link rel="stylesheet" type="text/css" href="/common-media/styles/privateBank.css" />'); 
 

 
WinPrint.document.close(); 
 
WinPrint.focus(); 
 
WinPrint.print(); 
 
WinPrint.close(); 
 
}

Может ли тело, пожалуйста, как показать окно ввода под названием «Имя клиента» только на предварительном просмотре печати, а не на на главной странице, откуда запускается событие печати.

код для ввода на основной выглядит следующим образом:

<div id="clientname" > 
 
         <div class="formBlock bgInput120"> 
 
          <label for="username">Client Name:</label> 
 
          <span class="input"> 
 
          <input type="text" id="cname" name="cname" /></span> 
 
         </div> 
 
        </div>

Answer 1

Попробуйте использовать CSS медиа-запрос:

@media print { 
    #clientname{ 
     display:block; /* show the Client Name when printing */ 
    } 
} 
@media screen { 
    #clientname{ 
     display:none; /* hide the Client Name normally */ 
    } 
} 

Это проверяет, что текущий медиа (печать, экран и т. д.) и будут применять эти стили только на указанных носителях.