论坛风格切换
您好,欢迎光临本站!   登录 注册新用户
  • 1454阅读
  • 0回复

[分享源码]Html5添加Canvas的EAN13条形码生成插件教程 [复制链接]

上一主题 下一主题
 
发帖
113
黑豆
565
威望
565
贡献值
0
交易币
0
红豆
0
只看楼主 倒序阅读 0 发表于: 2016-01-05
一、使用方法
如果你需要将该EAN13条形码插件作为jQuery插件来使用,那么需要在页面中引入jQuery和jquery-ean13.min.js文件。
<script type="text/javascript" src="js/jquery.min.js"></script>
<script type="text/javascript" src="dist/jquery-ean13.min.js"></script>

要通过JavaScript来调用该EAN13条形码,需要在页面中引入ean13.min.js文件。
<script type="text/javascript" src="dist/ean13.min.js"></script>

二、Html结构
制作一个EAN13条形码需要在页面上添加一个<canvas>元素。
<canvas id="EAN" width="400" height="200"></canvas>              

如果你想修改EAN13条形码的大小,只需要设置<canvas>元素的宽度和高度即可。

三、调用插件
下面的方法会显示不带任何参数选项的最基本的EAN13条形码:
JavaScript:
var element = document.getElementById("EAN");
new EAN13(element, "9002236311036");              

jQuery:
$("#EAN").EAN13("9002236311036");

四、配置参数
该EAN13条形码插件提供了一些可用的配置参数和回调函数,要使用它们,可以简单的在初始化插件的时候在第二个参数中提供一个参数对象。例如:

JavaScript:
var options={
number: false,
prefix: false,
onSuccess: function(){
    }
}
new EAN13(document.getElementById("EAN"), "9002236311036", options);      
          
jQuery:
$("#EAN").EAN13("9002236311036", {
number: false,
prefix: false
});    

KeyMob移动端广告平台,专业为开发者提供稳定的广告SDK,其中包括视频、插屏、全屏等等展现模式。同时也为开发者提供专业服务和广告解决方案,让开发者赚取更大的利润。
快速回复
限100 字节
 
上一个 下一个