返回免费在线工具集合

条形码生成器

在线生成 CODE128 条形码,支持自定义内容、条宽、高度与是否显示文字,导出 PNG 后可直接使用。

效率 独立定制 输出:图片文件 免费使用 发布时间: 阅读量:6 作者:马慧
正在加载工具…

货号只收半角

邢野替廿三里百货仓库重贴货架标签,货号是 "NSL-2026-00817"。页面上方内容框是四个控件里唯一绑了 input 重绘的,每敲一个字符右边就重画一次 CODE128 黑白条,下方带一行人眼可读的货号。源码 "codeOf" 只给 ASCII 32–126 正常码值,之外一律返回 63 静默换成 "?";中文或全角字符不会报错,条却已经变了。这个货号全是半角字母数字连字符,正好躲过。

填写要编码的货号

三个控件不被监听

接着设高度 140、模块宽度 3、勾上显示下方文字。可源码只有内容输入挂了 code.addEventListener('input', render),这三个参数一个都没被监听,改完屏幕上那张还是旧参数画的,看着像没反应。点"下载 PNG"时 exp() 里的 build() 却会重新读当前值出图,屏幕与存下来的可能不是同一张。想一致,就改完参数回去动一下内容框,删个字符再补回来,触发一次重绘。

调条码高度与模块宽度

读那行尺寸提示

预览是 canvas,"cv.width = total * M" 定宽,"H + 26" 是勾了下方文字后的高;黑条从 x=0 贴着画布左右两边画起,中间不留白。本次 canvas 实测 378×126,提示行写着"已生成 CODE128 条码(378×126)",后面接一句点下载 PNG 保存,两处尺寸对得上。下方货号固定 14px monospace 居中,长文本会被裁掉,不换行也不缩字号。

核对实时生成的 CODE128 预览

导出前补白边

底部只有一个"下载 PNG",点一下把 canvas 用 "toBlob" 编码存到本地,不经过服务器,一次一张、没有批量。文件名写死 "barcode.png",页面里改不了。打印前最好在四周手工补一圈白边:画布左右没有静区,贴到货架上若裁到边,扫码枪容易定位失败。正式贴之前拿一张试扫。

点「下载 PNG」保存标签

企业知识网( www.qiyezhishi.com )提供的结果为参考性内容,不构成法律、税务或投资建议。具体请以主管部门口径与最新法规为准。

本文作者

马慧,企业知识网站长,10年+SEO/GEO经验,精通白帽SEO与网站优化,擅长全网营销与短视频引流,曾打造日均万IP的SEO博客(小小课堂网)、十万IP泛流量资讯网站(错误博客)。自川来熟食连锁店长,5年熟食生产与管理经验,精通抖音本地生活服务运营。