外卖网站的建设与推广,长沙网站建设开发,小锋云主机,做瞹瞹瞹视频网站一、前言
最近做项目用到了JS生成条形码和二维码#xff0c;内容不多#xff0c;整理一下方便使用。
2018年7月5日更新#xff1a;
二维码生成时#xff0c;如果长度太长会有异常#xff1a; Uncaught Error: code length overflow. (16041056) 创建的时候#…一、前言
最近做项目用到了JS生成条形码和二维码内容不多整理一下方便使用。
2018年7月5日更新
二维码生成时如果长度太长会有异常 Uncaught Error: code length overflow. (16041056) 创建的时候添加 correctLevel: 3 就可以解决了。
二、资源打包下载
资源下载
三、JS条形码生成
1、Github
这里是作者的Github有更详细的内容可以学习 https://github.com/lindell/JsBarcode
2、JS引用
script typetext/javascript srcjquery-2.1.3.min.js/script
script typetext/javascript srcJsBarcode.all.min.js/script
3、主要代码
script$(#svgcode).JsBarcode(Hi!);//or JsBarcode(#svgcode, Hi!);$(#canvascode).JsBarcode(Hello world!);//or JsBarcode(#canvascode, Hello world!);JsBarcode(#imgcode, 20170715152058515);//or $(#imgcode).JsBarcode(Im huangenai!);
/script
4、条形码效果图 四、JS二维码生成
1、Github
这里是作者的Github有更详细的内容可以学习 https://github.com/davidshimjs/qrcodejs
2、Js引用
script typetext/javascript srcjquery-2.1.3.min.js/script
script typetext/javascript srcqrcode.js/script
3、主要代码
var qrcode new QRCode(document.getElementById(qrcode), {width: 400,height: 400,correctLevel: 3
});
function makeCode() {var elText document.getElementById(text);if (!elText.value) {alert(Input a text);elText.focus();return;}qrcode.makeCode(elText.value);
}
4、二维码效果图 五、扩展学习
之前收藏了一张二维码动图详解这里分享一下