JS 生成条形码（一维码）jsBarcode(js生成条形码的方式有哪些)

发布时间：2024-01-16

JS 生成条形码（一维码）jsBarcode jsBarcode 官网一、安装

推荐整理分享JS 生成条形码（一维码）jsBarcode(js生成条形码的方式有哪些)，希望有所帮助，仅作参考，欢迎阅读内容。

文章相关热门搜索词:条形码生成 java,js条形码识别,条形码生成 java,条形码生成 java,js生成条形码并打印,js生成条形码,js生成条形码,js生成条形码,内容如对您有帮助，希望把文章链接给更多的朋友！

script 引入

地址：https://cdn.jsdelivr.net/npm/jsbarcode@3.11.5/dist/JsBarcode.all.min.js 也可以进官网查看地址。

npm方式安装：

npm install jsbarcode --save

页面引入：

import JsBarcode from "jsbarcode";二、使用

HTML部分加入svg容器

JS 代码部分

JsBarcode("#barcode", "Hi world!");

三、结果

参数设置（options）

option默认值类型说明format“auto” (CODE128)String条形码的类型width2Number每个条条的宽度，注意这里不是指整个条形码的宽度height100Number整个条形码的宽度displayValuetrueBoolean是否显示条形码下面的文字fontOptions“”String设置条形码文本的粗体和斜体样式 bold / italic / bold italicfont“monospace”String设置条形码显示文本的字体textAlign“center”String条形码文本的水平对齐方式，和css中的类似： left / center / righttextPosition“bottom”String条形码文本的位置 bottom / toptextMargin2Number条形码文本和条形码之间的间隙大小fontSize20Number设置条形码文本的字体大小background“#ffffff”String (CSS color)整个条形码容器的背景颜色lineColor“#000000”String (CSS color)条形码和文本的颜色margin10Number整个条形码的外面距marginTopundefinedNumber整个条形码的上边距marginBottomundefinedNumber整个条形码的下边距marginLeftundefinedNumber整个条形码的左边距marginRightundefinedNumber整个条形码的右边距validfunction(valid){}Function执行完条形码的一个回调函数，正确true 错误false

options 使用方法

let options = { fontSize: 12, background: "#cccccc"};JsBarcode("#barcode", "Hi world!", options);

本文链接地址:https://www.jiuchutong.com/zhishi/297852.html 转载请保留说明！

上一篇：HTML作业04——简易美食页面(html作业做网页)

下一篇：vue 项目中刷新当前路由(vue页面刷新时原有的数据还在吗)