js生成条形码――JsBarcode

匿名 (未验证) 提交于 2019-12-02 23:40:02

原文地址:https://www.cnblogs.com/huangenai/p/6347607.html

介绍一下在GitHub生成条形码的js插件→JsBarcode

条码支持的有:

CODE128


EAN





CODE39
ITF-14
MSI




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>

 <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

易学教程内所有资源均来自网络或用户发布的内容,如有违反法律规定的内容欢迎反馈
该文章没有解决你所遇到的问题?点击提问,说说你的问题,让更多的人一起探讨吧!