javascript - 如何使用 jquery/javascript 从打印预览中获取输入值

Question

我有这个带有字段的示例 html 内容我需要打印包括输入值在内的所有内容并将其显示在示例预览中。我尝试使用此脚本来触发打印:

示例打印工作正常，但是，输入值未显示。我怎样才能做到这一点？我应该使用 html() 函数以外的替代方法吗？

function PrintPreview() {
  printWindow = window.open("", "", "location=1,status=1,scrollbars=1,width=650,height=600");
  printWindow.document.write($('#mainbody').html());
  printWindow.document.close();
  printWindow.focus();
}

<script src="http://code.jquery.com/jquery-latest.min.js" type="text/javascript"></script>

<div id="mainbody">
  Last Name
  <input type="text" id="lname" name="lname">First Name
  <input type="text" id="fname" name="fname">Middle Name
  <input type="text" id="mname" name="mname">
</div>
<input type="button" onclick="PrintPreview();" value="Print Preview" />

Answer 1

这对我有用 - 将值复制到 value 属性并克隆 div

function PrintPreview() {
  $("#mainbody > input").each(function() { 
    $(this).attr("value",$(this).val()); 
  });

  var printWindow = window.open("", "_blank", "location,status,scrollbars,width=650,height=600");
  if (printWindow) {
    printWindow.document.write($('#mainbody').clone(true)[0].innerHTML);
    printWindow.document.close();
    printWindow.focus();
  }
  else alert("Please allow popups");
}

或者

How to print only one div content from html page using print button