我正在尝试打印一个对话框。我可以打印对话框中除 Textbox
值之外的所有内容。
HTML
<div class="calculator">
<a href="#" onclick="printElement('.calculator')">
<img src="images/icon_print.png" /> Print
</a>
</div>
JS
function printElement(element) {
var text = document.getElementById("age_input").value;
alert(text);
w = window.open();
w.document.write($(element).html());
w.document.close();
document.getElementById("age_input").value = text;
w.print();
w.close();
}
如何打印包含 Textbox
元素中的值的对话框?
最佳答案
好问题。我花了一段时间才弄清楚。问题在于,当您使用 $(element).html()
您可以通过任何浏览器开发工具 (F12) 检查元素来看到这一点。因此,您必须使内容成为 HTML 的一部分,以便在打印期间可用。一个快速的解决方法是使用输入框的 placeholder
属性。这是代码的更新版本。
<script type="text/javascript">
function printElement(element) {
var text = document.getElementById("age_input").value;
document.getElementById("age_input").placeholder = text;
w = window.open();
w.document.write('<html><head><title>DIV Contents</title>');
w.document.write('</head><body >');
w.document.write($(element).html());
w.document.write('</body></html>');
w.document.close();
document.getElementById("age_input").value = text;
w.print();
w.close();
}
</script>
我假设 age_input
是您的输入框,并且位于 Div 元素内
<div class="calculator">
<input id="age_input" type="text" />
<a href="#" onclick="printElement('.calculator')"> <img src="images/icon_print.png" />Print</a>
</div>
关于javascript - Javascript/Asp.net 中的对话框未打印文本框,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/37287233/