qq_17031883 2024-03-22 14:37 采纳率: 32.3%
浏览 40
已结题

打印小票用什么js比较好

打印小票用什么js比较好，小票80*50mm，有专门的打印js吗？对接的是得力小票打印机

img

  • 写回答

24条回答 默认 最新

  • 码农阿豪@新空间代码工作室 Java领域优质创作者 2024-03-22 14:38
    关注
    获得0.30元问题酬金
    让阿豪来帮你解答，本回答参考chatgpt3.5编写提供，如果还有疑问可以评论或留言
    回答： 针对打印小票的需求，我建议使用浏览器的原生JavaScript结合CSS来完成。既不需要引入额外的库，又可以很灵活地进行定制。 下面是一个样例代码，其中包含了打印小票的基本样式和内容： 
    <!DOCTYPE html>
<html lang="zh-CN">
<head>
    <meta charset="UTF-8">
    <title>小票打印样例</title>
    <style>
        @page {
            size: 80mm 50mm;
            margin: 0mm;
        }
        * {
            box-sizing: border-box;
        }
        .container {
            width: 80mm;
            height: 50mm;
            border: 1px solid black;
            padding: 10px;
            font-family: 'Microsoft YaHei', sans-serif;
        }
        .title {
            font-size: 20px;
            font-weight: bold;
            text-align: center;
            margin-bottom: 10px;
        }
        .item {
            display: flex;
            justify-content: space-between;
            margin-bottom: 5px;
            font-size: 14px;
        }
    </style>
</head>
<body>
    <div class="container">
        <div class="title">小票样例</div>
        <div class="item">
            <span>商品名称：</span>
            <span>苹果</span>
        </div>
        <div class="item">
            <span>商品数量：</span>
            <span>10斤</span>
        </div>
        <div class="item">
            <span>商品单价：</span>
            <span>5元/斤</span>
        </div>
        <div class="item">
            <span>总价：</span>
            <span>50元</span>
        </div>
    </div>
    <script>
        window.print();
    </script>
</body>
</html>

    这段代码会生成一个小票的样式，并在打印时自动调用浏览器的打印功能。你可以根据自己的实际需求来灵活修改样式和内容。 至于得力小票打印机的对接，我建议在打印机驱动程序中设置好默认纸张大小和边距。这样当浏览器打印时，就能正确识别打印机的纸张大小并按照设定的边距进行排版。 总的来说，JavaScript和CSS是一种非常便捷和灵活的小票打印方案。只要对浏览器有一定的了解，便可根据实际需求定制出符合要求的小票样式。

    评论

报告相同问题？

问题事件

  • 系统已结题 3月30日
  • 赞助了问题酬金15元 3月22日
  • 创建了问题 3月22日

悬赏问题

  • ¥15 webstorm上开发的vue3+vite5+typeScript打包时报错
  • ¥15 vue使用gojs，需求在link中的虚线上添加方向箭头
  • ¥15 CSS通配符清除内外边距为什么可以覆盖默认样式？
  • ¥15 SPSS分类模型实训题步骤
  • ¥15 求解决扩散模型代码问题
  • ¥15 工创大赛太阳能电动车项目零基础要学什么
  • ¥20 limma多组间分析最终p值只有一个
  • ¥15 nopCommerce开发问题
  • ¥15 torch.multiprocessing.spawn.ProcessExitedException: process 1 terminated with signal SIGKILL
  • ¥15 QuartusⅡ15.0编译项目后，output_files中的.jdi、.sld、.sof不更新怎么解决