Question

在使用Print.js Javascript库时，请您协助打印一个下拉选择值，原始选择会保留，并且在您获得打印窗口时不会动态更改...

https://codepen.io/markchavush/pen/WWrWda

    <!DOCTYPE html>
<html lang="en">
<head>

  <!-- Basic Page Needs
  –––––––––––––––––––––––––––––––––––––––––––––––––– -->
  <meta charset="utf-8">
  <title>Your page title here :)</title>
  <meta name="description" content="">
  <meta name="author" content="">

  <!-- Mobile Specific Metas
  –––––––––––––––––––––––––––––––––––––––––––––––––– -->
  <meta name="viewport" content="width=device-width, initial-scale=1">

  <!-- FONT
  –––––––––––––––––––––––––––––––––––––––––––––––––– -->
  <link href="https://fonts.googleapis.com/css?family=Raleway" rel="stylesheet">

  <!-- CSS
  –––––––––––––––––––––––––––––––––––––––––––––––––– -->
  <link rel="stylesheet" href="css/normalize.css">
  <link rel="stylesheet" href="css/skeleton.css">

  <!-- Favicon
  –––––––––––––––––––––––––––––––––––––––––––––––––– -->
  <link rel="icon" type="image/png" href="images/favicon.png">

</head>
<body>

  <!-- Primary Page Layout
  –––––––––––––––––––––––––––––––––––––––––––––––––– -->
  <div class="container">
   <form method="post" action="#" id="printJS-form">
  <div class="row">
    <div class="six columns">
      <label for="exampleEmailInput">Your email</label>
      <input class="u-full-width" type="email" placeholder="test@mailbox.com" id="exampleEmailInput">
    </div>
    <div class="six columns">
      <label for="exampleRecipientInput">Reason for contacting</label>
      <select class="u-full-width" id="exampleRecipientInput">
        <option value="Option 1">Questions</option>
        <option value="Option 2">Admiration</option>
        <option value="Option 3">Can I get your number?</option>
      </select>
    </div>
  </div>
  <label for="exampleMessage">Message</label>
  <textarea class="u-full-width" placeholder="Hi Dave …" id="exampleMessage"></textarea>


</form>
      <button type="button" onclick="printJS({ printable: 'printJS-form', type: 'html', header: 'PrintJS - Form Element Selection', css: 'https://cdnjs.cloudflare.com/ajax/libs/skeleton-framework/1.1.1/skeleton.min.css' })">
    Print Form with Header
 </button>
</div>
<!-- End Document
  –––––––––––––––––––––––––––––––––––––––––––––––––– -->
<script src="https://printjs-4de6.kxcdn.com/print.min.js"></script>
</body>
</html>

请直接转到代码笔并按打印按钮，以查看下拉列表值在打印输出中没有正确显示...

欢呼

标记

Answer 1

您不能，但不能使用Print.js库。

您面临的问题是一个已知问题-他们的GitHub存储库上创建了an issue，在2018年详细说明了此确切问题。（该问题已合并到this open issue中，因为显然是同一问题）。最初的GitHub发行者甚至创建了一个JSFiddle来演示您在Codepen中显示的相同问题。

我唯一的建议是尝试实现类似于this answer的功能，尽管我不会假装这很容易。

如何在Print.js中打印下拉选择值？

1 个答案: