【问题标题】:how to print a data from input fields to hard copy? [duplicate]如何将输入字段中的数据打印到硬拷贝? [复制]
【发布时间】:2021-08-27 18:35:19
【问题描述】:

我正在创建一个项目并希望将输入字段中的数据打印到硬拷贝上...

我该怎么做?

例如: 如果我有一个带有输入字段的表格,并且我将使用浏览器将数据输入到该字段中,那么现在,一旦我完成输入,我就想打印该信息。 (代码 UNDER),我从 W3schools 获取了这个代码:当我按下打印按钮时,它会打印网页..但它不会打印提供给它的信息......

我该怎么做>

这是我的代码:

<!DOCTYPE html>
<html>
<title>Print form</title>
<meta name="viewport" content="width=device-width, initial-scale=1">
<body>
<form method="post" action="" id="myfrm">
    <fieldset>
        <legend>Personal information:</legend>
        First name:<br>
        <input type="text" name="firstname">
        <br> Last name:<br>
        <input type="text" name="lastname">
        <br><br>
        <input type="submit" value="Submit">
    </fieldset>
</form>
<p align="center"><input type="button" onclick="myPrint('myfrm')" value="print"></p>
<script>
    function myPrint(myfrm) {
        var printdata = document.getElementById(myfrm);
        newwin = window.open("");
        newwin.document.write(printdata.outerHTML);
        newwin.print();
        newwin.close();
    }
</script>
</body>
</html>

'''

【问题讨论】:

标签: javascript html web


【解决方案1】:

您是在复制 HTML,而不是字段值,下面的代码可以解决问题。

看到输入字段现在有 ID,我们将它们复制到 newwin.print() 之前的位置

<!DOCTYPE html>
<html>
<title>Print form</title>
<meta name="viewport" content="width=device-width, initial-scale=1">
<body>
<form method="post" action="" id="myfrm">
    <fieldset>
        <legend>Personal information:</legend>
        First name:<br>
        <input type="text" name="firstname" id="first">
        <br> Last name:<br>
        <input type="text" name="lastname" id="last">
        <br><br>
        <input type="submit" value="Submit">
    </fieldset>
</form>
<p align="center"><input type="button" onclick="myPrint('myfrm')" value="print"></p>
<script>
    function myPrint(myfrm) {
        var printdata = document.getElementById(myfrm);
        newwin = window.open("");
        newwin.document.write(printdata.outerHTML);
        newwin.document.getElementById("first").value = document.getElementById("first").value;
        newwin.document.getElementById("last").value = document.getElementById("last").value;
        newwin.print();
        newwin.close();
    }
</script>
</body>
</html>

【讨论】:

    猜你喜欢
    • 1970-01-01
    • 1970-01-01
    • 2013-06-02
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    相关资源
    最近更新 更多