Question

我有一个包含60种不同输入的页面。它们都是数字，需要根据其中一个输入进行检查。如果该输入大于3，则父div变为红色。一切都很美妙，除非我尝试通过我的javascript函数打印我给出的样式（document.getElementById（classid）.style.backgroundColor =＆＃34; red＆＃34 ;;）不显示print。如何使用函数给出的样式打印页面？

<script type="text/javascript">
function CheckThisNumber(val, id){
    var x = document.getElementById("a6").value;
    var y = Number(x) +3;
    var classid = "p" + id;
    if((val)>=y) { 
    document.getElementById(classid).style.backgroundColor = "red"; } 
    else { document.getElementById(classid).style.backgroundColor = "white"; }
}
</script>

众多输入中的一个：

<div class="a1" id="pa1">
<strong>A1</strong><br><input type="number" name="a1" id="a1" style="width:95%" onKeyUp="CheckThisNumber(this.value,this.id)">
</div>

Answer 1

正如我在评论中所说，它基于浏览器的打印设置。您可以在浏览器的设置中启用它，它只是正常打印它们，但默认情况下它被禁用以节省墨水。

某些浏览器支持非标准CSS以强制BG打印

-webkit-print-color-adjust: exact

info：https://developer.mozilla.org/en-US/docs/Web/CSS/-webkit-print-color-adjust

另一个后退将是使用框阴影

.redBG { box-shadow: inset 0 0 0 100px #FF0000; }
.whiteBG { box-shadow: inset 0 0 0 100px #FFFFFF; }

如果您在大型textarea上使用它，则可能需要将100px设置为更大的值。

使用javascript样式打印页面

1 个答案: