条形码--JsBarcode
介绍一下在GitHub生成条形码的js插件→JsBarcode
条码支持的有:
CODE128
CODE128 (自动模式切换)
CODE128 A/B/C (强制模式)
EAN
EAN-13
EAN-8
EAN-5
EAN-2
UPC (A)
CODE39
ITF-14
MSI
MSI10
MSI11
MSI1010
MSI1110
Pharmacode
Codabar
代码
<!DOCTYPE html> <html><head> <meta charset="utf-8" /> <meta name="viewport" content="width=device-width, initial-scale=1,maximum-scale=1, user-scalable=no" /> <title></title> <script type="text/javascript" src="https://code.jquery.com/jquery-2.1.3.min.js"></script> <script type="text/javascript" src="js/JsBarcode.all.js"></script> </head> <body> <svg id="svgcode"></svg> <!-- or --> <canvas id="canvascode"></canvas> <!-- or --> <img id="imgcode" /> <script> $("#svgcode").JsBarcode('Hi!');//or JsBarcode("#svgcode", "Hi!"); $("#canvascode").JsBarcode('Hello world!');//or JsBarcode("#canvascode", "Hello world!"); $("#imgcode").JsBarcode("I'm huangenai!");//or JsBarcode("#imgcode", "I'm huangenai!"); </script> </body></html>
JsBarcode 我们还可以设置条码的一些属性(可设置属性详细介绍 链接:https://github.com/lindell/JsBarcode/wiki/Options)
<img id="imgcode" /> <script> JsBarcode("#imgcode", "123", {format: "CODE39",//选择要使用的条形码类型width:3,//设置条之间的宽度height:100,//高度displayValue:true,//是否在条形码下方显示文字text:"456",//覆盖显示的文本fontOptions:"bold italic",//使文字加粗体或变斜体font:"fantasy",//设置文本的字体textAlign:"left",//设置文本的水平对齐方式textPosition:"top",//设置文本的垂直位置textMargin:5,//设置条形码和文本之间的间距fontSize:15,//设置文本的大小background:"#eee",//设置条形码的背景lineColor:"#2196f3",//设置条和文本的颜色。margin:15//设置条形码周围的空白边距 });</script>
GitHub:https://github.com/lindell/JsBarcode
条码生成器:http://lindell.me/JsBarcode/generator/
JsBarcode示例与设置:http://codepen.io/lindell/pen/mPvLXx?editors=1010
简单的JsBarcode演示:http://codepen.io/lindell/pen/eZKBdO?editors=1010
条形码--JsBarcode相关推荐
- html如何生成条形码,前端如何生成条形码---JsBarcode
React 生成条形码代码 注:需引入 jsbarcode 插件 import React from 'react'; import JsBarcode from 'jsbarcode'; class ...
- vue 条形码--JsBarcode
介绍一下在GitHub生成条形码的js插件→JsBarcode npm install jsbarcode npm install canvas var JsBarcode = require('js ...
- 条形码--JsBarcode(银联二维码用过)
介绍一下在GitHub生成条形码的js插件→JsBarcode 条码支持的有: CODE128 CODE128 (自动模式切换) CODE128 A/B/C (强制模式) EAN EAN- ...
- vue中生成条形码(jsbarcode)、二维码(qrcodejs2)
1.条形码插件jsbarcode 安装:npm install jsbarcode --save 引入:在需要生成条形码的页面引入即可 import JsBarcode from 'jsbarcode ...
- vue3.0 + JsBarcode 循环生成多个条形码(setup语法糖)
1.安装jsbarcode npm install jsbarcode --save 2.html页面循环数据 //id动态绑定,使用类名加index <div class='js_barcod ...
- JsBarcode:JS条形码生成
Jquery 下载地址:http://www.jq22.com/jquery-info122 JsBarcode 下载地址:http://www.jq22.com/jquery-info15657 & ...
- JS生成条形码/二维码 barcode.js、JsBarcode
JS生成条形码/二维码 barcode.JsBarcode JsBarcode Barcode.js 以下代码均非纯原创.新手小白.网上一搜一大把的概念也不写了,直接上可运行的代码及遇到的小坑. Js ...
- vue 项目中生成条形码(jsbarcode)
条形码插件介绍和使用 安装: cnpm install jsbarcode --save 引入:在要生成条形码的页面引入即可 import JsBarcode from 'jsbarcode' 3.二 ...
- 使用JsBarcode生成条形码
引入jquery和JsBarcode.all.js(注意:引入JsBarcode.js无效) github地址:https://github.com/lindell/JsBarcode 代码: < ...
最新文章
- 2015计算机二级java真题_2015年计算机二级《JAVA》章节习题及答案(9)
- 增强学习--蒙特卡洛方法
- mysql 数据操作 多表查询 子查询 带比较运算符的子查询
- 详解jdbcTemplate和namedParameterJdbcTemplate
- TCP/IP与OSI的特征对比总结
- bit, byte, KB, GB, TB, PB, EB, ZB, YB, BB, NB, DB, CB, XB
- 图解《金字塔原理》,7步掌握其精华!
- 养老院智能健康手环开发/功能/特点/结构/原理
- since作为连词引导时间状语从句的用法
- 土豆网(第三方网站)使用qq登录的步骤和原理------oAuth协议
- 强收红包漫天要价偷转黑车……滴滴网约车被指太任性
- 输出满足某种条件的素数(C语言)
- 透过J2Cache的吐槽,领悟代码的设计
- 如何在安卓上android studio上构建本地服务器
- mysql 充值表设计_如何设计充值消费的数据表
- 盒子模型(CSS重点)
- 烘焙门店 | 解锁公众号精准引流5W+的流量密码
- saveOrUpdate Transaction silently rolled back because it has been marked as rollback-only
- 证券公司信用风险管理体系—以平安证券为例-课后检验-满分
- hbw-utils - 基本数据类型进制转换的实现
热门文章
- SpringBoot的Web开发入门案例1
- 感知机(perceptron):原理、python实现及sklearn.linear_model.Perceptron参数详解
- mysql mklink_挂载与链接(assign与mklink)——Windows 7的磁盘分区规划 | 学步园
- Android 自带浏览器谷歌账号自动登录的实现
- redis有序集合键(数据结构篇)
- 数据交换平台的架构设计
- 小学英语计算机融合课说课稿,信息技术与小学英语整合教学说课稿 |参考教案_小学英语教案及说课稿,小学信息技术说课稿...
- for /f命令之—Delims和Tokens用法总结
- 从ipad远程计算机步骤,如何使用iPhone/iPad远程访问计算机
- 【英语】大学英语CET考试,词汇语法50h+(导学方法论,词汇3关键,语法3大山)