HTML+;CSS+;可打印HTML表单的Javascript框架?

HTML+;CSS+;可打印HTML表单的Javascript框架?,javascript,html,css,printing,Javascript,Html,Css,Printing,我需要准备一些足球比赛的表格。简单的东西:表格、规则和一些文本标签。起初,我启动了一个DTP应用程序来创建一个可打印的PDF表单,但后来我意识到我更愿意用HTML、CSS和Javascript来做这件事 是否有一个可打印的面向表单的框架,可以让我排版一个表单,然后任选地让用户填写一些文本并打印整个表单,客户端 请注意,我不是在追求常规的交互式HTML表单设计提交到一些后端服务。我想要一些模拟老式纸质表单的东西,并且,对于可选的奖励积分,可以让用户在打印之前输入一些文本数据 举一个例子,如下所示

我需要准备一些足球比赛的表格。简单的东西:表格、规则和一些文本标签。起初,我启动了一个DTP应用程序来创建一个可打印的PDF表单,但后来我意识到我更愿意用HTML、CSS和Javascript来做这件事

是否有一个可打印的面向表单的框架,可以让我排版一个表单,然后任选地让用户填写一些文本并打印整个表单,客户端

请注意,我不是在追求常规的交互式HTML表单设计提交到一些后端服务。我想要一些模拟老式纸质表单的东西,并且,对于可选的奖励积分,可以让用户在打印之前输入一些文本数据


举一个例子,如下所示:

<h1>Player List</h1>
<div class="field" data-label="Team Name" class="right"></div>
<table data-rows="5">
    <thead>
        <tr>
            <th>number</th>
            <th>name</th>
        </tr>
    </thead>
 </table>
这些字段可以点击,我可以在打印前填写文本。(同样,客户端,没有服务器。)

可以帮助您快速创建外观美观的表单。 您可以选择使用其他框架,例如,或将数据实际保存到某个位置。但它似乎并不需要。

可以帮助您快速创建外观美观的表单。
您可以选择使用其他框架,例如,或将数据实际保存到某个位置。但是你似乎不需要它。

+1对于引导,但是考虑到数据永远不会去任何地方,主干、角度等都是不相关的。你完全正确……我看到了“表单”+“输入数据”,这在我的脑海中触发了一些东西:)引导对于我想要的东西来说太低级了。举个例子,如果我想在表单中有一个玩家表,我必须自己插入所有的行和输入,而不是说“我想要一个有X行和这样的列的可编辑表”,甚至在运行时有一些控件插入行。对不起…想不出有什么可以帮到你的。对于引导+1,但是考虑到数据永远不会去任何地方,像主干、角度等都是无关紧要的。你绝对是对的……我看到了“表单”+“输入数据”,这在我脑海中触发了一些东西:)Bootstrap对于我想要的东西来说太低级了。例如,如果我想在表单中有一个player表,我必须自己插入所有的行和输入,而不是说“我想要一个有X行和这样的列的可编辑表”,或者甚至有一些控件在运行时插入行。抱歉…想不出任何东西可以帮助您。当创建可以使用的HTML并通过javascript打印时,您可以在这里查看:老实说。。。设置一组类来添加您的输入和标签是非常简单的,这些输入和标签提供了容器的百分比宽度。然后对所述输入和标签进行一些快速样式设置。没有什么特别需要在打印方面的东西,填写你想要的,然后去文件打印,一切都在那里。我不明白你为什么不自己做而不是使用一个框架?我不明白为什么一个人只需要一个完整的框架来格式化一些小而简单的打印格式——这就是CSS媒体类型的用途。(如果输入字段在打印时出现问题,那么只需添加一个小JS,即可在其他HTML元素中转换输入值,并在一个大按钮上单击名为onclick的按钮
Print this!
,然后调用
window.Print()
,以触发浏览器的打印对话框……)如果代码已经存在,并且如果代码不存在,那么它就不值得了,这将是一件美妙的事情。如果我必须自己编写代码,我在DTP应用程序中的速度会快得多。我只是希望现有的解决方案具有漂亮、干净的样式(甚至主题)和一些漂亮的附加功能,如构建输入填充表等。当创建HTML时,您可以使用javascript进行打印,您可以在这里查看:老实说。。。设置一组类来添加您的输入和标签是非常简单的,这些输入和标签提供了容器的百分比宽度。然后对所述输入和标签进行一些快速样式设置。没有什么特别需要在打印方面的东西,填写你想要的,然后去文件打印,一切都在那里。我不明白你为什么不自己做而不是使用一个框架?我不明白为什么一个人只需要一个完整的框架来格式化一些小而简单的打印格式——这就是CSS媒体类型的用途。(如果输入字段在打印时出现问题,那么只需添加一个小JS,即可在其他HTML元素中转换输入值,并在一个大按钮上单击名为onclick的按钮
Print this!
,然后调用
window.Print()
,以触发浏览器的打印对话框……)如果代码已经存在,并且如果代码不存在,那么它就不值得了,这将是一件美妙的事情。如果我必须自己编写代码,我在DTP应用程序中的速度会快得多。我只是希望有一个现有的解决方案,具有漂亮、干净的样式(甚至主题)和一些漂亮的额外功能,比如构建输入填充表等等。
PLAYER LIST                         _______________
                                       Team Name

number | name
-------+----------
       |
-------+----------
       |
-------+----------
       |
-------+----------
       |
-------+----------
       |
-------+----------