我尝试了 window.print()
函数来打印页面,但它没有打印单选按钮的选中值
function myFunction() {
window.print();
}
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/materialize/1.0.0/css/materialize.min.css">
<link href="https://fonts.googleapis.com/icon?family=Material+Icons" rel="stylesheet">
<meta name="viewport" content="width=device-width, initial-scale=1.0"/>
<link rel="stylesheet" type="text/css" href="../css/styles.css" media="screen" />
<script src="https://cdnjs.cloudflare.com/ajax/libs/materialize/1.0.0/js/materialize.min.js"></script>
</head>
<body>
<form action="#">
<p><label><input checked name="group1" style="display: block" type="radio"> <span style="color:blue">Red</span></label></p>
<p><label><input name="group1" type="radio"> <span>Yellow</span></label></p>
<p><label><input class="with-gap" name="group1" type="radio"> <span>Green</span></label></p>
</form><button class="waves-effect waves-light btn" id='printButton' onclick="myFunction()"> Print </button>
单击打印按钮时,打印页面应该选中单选按钮。
最佳答案
我在使用 Angular Material v9、Chrome v81 时遇到了这个问题。问题是如果背景图像被关闭,单选按钮(和复选框)中的“选中”不会显示,这在 Chrome 中似乎是默认设置。
将以下内容添加到您的样式表将解决问题:
-webkit-print-color-adjust: exact !important;
也应该适用于 Materialise。
关于javascript - window.print() 函数不显示单选按钮和复选框的选中值,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/56501373/