Question

我正在尝试仅在页面的打印预览上显示输入框而不是在主页面上。我使用以下函数来获取打印预览：

＆＃13;

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();
}

＆＃13;

任何正文都可以告诉我们如何显示一个名为＆＃34;客户名称＆＃34;的输入框。仅在打印预览上，而不是在触发打印事件的主页上。

主要输入框的代码如下：

＆＃13;

<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>

＆＃13;

Answer 1

尝试使用css媒体查询：

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

检查当前媒体的内容（打印，屏幕等），并仅在指定媒体中应用这些样式。

从打印预览中删除输入框

1 个答案: