Question

我有一个使用C＃MVC3开发的页面。这是一份多员工报告。生成的页面将为每个记录/员工提供一个复选框。这个想法是让用户选中他们想要打印的每个记录旁边的框。当他们单击页面上的“打印”按钮时，将仅打印那些选定的记录。我怎么能做到这一点？

Answer 1

使用Javascript添加/删除将在打印期间隐藏内容的类。以下是jsFiddle上的示例。

修改：要获得最大支持，请添加单独的样式表，而不是使用媒体查询。

<link rel="stylesheet" media="print" href="/print.css" type="text/css" />

<强> HTML

<input type="checkbox" value="a" name="a"/> A |
<input type="checkbox" value="b" name="b"/> B |
<input type="checkbox" value="c" name="c"/> C

<div id="a" class="no-print">Content A</div>
<div id="b" class="no-print">Content B</div>
<div id="c" class="no-print">Content C</div>

<强> CSS

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

/* For Styles */
div {
    background: #CCC;
    padding: 5px;
    margin: 5px;
}

.no-print {
    opacity: 0.5;
}

<强>的jQuery

$('input[type="checkbox"]').click(function() {
    if ($(this).is(':checked')) {
        $("#"+ $(this).attr('value')).removeClass('no-print');
    } else {
        $("#"+ $(this).attr('value')).addClass('no-print');
    }
});

仅打印选定的元素/页面

1 个答案: