zoukankan      html  css  js  c++  java
  • Barcode.js功能强大的条码生成jQuery插件

    本文转载自http://www.uedsc.com/barcode-js.html

    Barcode.js是一个基于jQuery库的插件,用于绘制条形码或者二维码,能够生成基于DIV+CSS或者Canvas等的条码,该插件支持PHP,jQuery和JavaScript,解压后对应3个目录,每个目录下都有对应的例子可以查看。

    Barcode.js功能强大的条码生成jQuery插件

    注意:需要绘制的条形码/二维码长度和字符串包含字母之类的,注意要选择不同的条形码/二维码类型,要不无法绘制(没研究过条形码,经测试视乎是这样的)。建议直接选择code128。

    使用方法

    1、同其他jQuery插件一样,只需要将jQuery框架和jquery.barcode.js文件引入页面。

    <script type="text/javascript" src="jquery.min.js"></script>
    <script type="text/javascript" src="jquery.barcode.js"></script>

    2、定义一个DOM对象作为生成条形码/二维码的容器

    <div id="bcTarget"></div>

    3、使用jQuery选择器调用barcode()方法绘制条形码/二维码

    $("#bcTarget").barcode("1234567890128", "ean13");

    根据输入字符的长度来生成对应的条形码

    function genCode(){
        var encode = "ean8";
        if(8 === $("#exam_no").text().length) encode = "ean8";
        else if(11 === $("#exam_no").text().length) encode = "code11";
        else if(13 === $("#exam_no").text().length) encode = "ean13";
        $("#code_b").barcode($("#exam_no").text(), encode, {barWidth: 2, barHeight: 50});
        $("#code_s").barcode($("#exam_no").text(), encode, {barWidth: 1, barHeight: 50});
        $("#code_b div").css('background-color', '#eee');
    }

    参数说明

    jquery对象扩展方法barcode参数说明:barcode: function(datas, type, settings)

    datas参数支持2种类型

    • string:要绘制的条形码字符串内容(依赖于条形码的类型)。如果条形码类型能容纳这些字符,并且存在校 验不是强制性的,字符串的ISE将会自动计算(原文:If barcode type include it, the presence of the checksum is not mandatory, it ise automatically recalculated)
    • object
      type : ean8, ean13, code11, code39, code128, codabar
      memberType
      code string
      type : std25, int25, code93
      memberType
      code string
      crc boolean
      type : msi
      memberType
      code string
      crc boolean
      object crc1 : string(“mod10”, “mod11”)
      crc2 : string(“mod10”, “mod11”)
      type : datamatrix
      memberType
      code string
      rect boolean (default : false)

    type (string):条形码类型

    注意要根据字符串长度来选择条形码的编码方式,生成的条形码默认是DIV+CSS形式的,后面的barWidthbarHeight是生成参数,默认是70X70的正方形,后面的参数可以调整条形码的比例,但不能调整大小

    • codabar
    • code11 (code 11)
    • code39 (code 39)
    • code93 (code 93)
    • code128 (code 128)
    • ean8 (ean 8)
    • ean13 (ean 13)
    • std25 (standard 2 of 5 – industrial 2 of 5)
    • int25 (interleaved 2 of 5)
    • msi
    • datamatrix (ASCII + extended)

    settings (object):条形码样式的配置

    配置名称类型默认值描述限制
    barWidth int 1 条形码宽度 1D
    barHeight int 50 容器高度 1D
    moduleSize int 5 largeur / hauteur d’un module 2D
    showHRI bool true 是否显示条形码内容(方便识别)  
    bgColor text #FFFFFF 背景色  
    color text #000000 条形码颜色  
    fontSize int 10 显示的条形码内容字体大小  
    output text css 如何绘制条形码: css, svg, bmp, canvas,注意svg,bmp,canvas不支持IE,最好不用  
    renderer : canvas
    ParameterTypeDefault valueDetail
    posX int 0 X origine
    posY int 0 Y origine

    相关链接

  • 相关阅读:
    UVa 116 单向TSP(多段图最短路)
    POJ 1328 Radar Installation(贪心)
    POJ 1260 Pearls
    POJ 1836 Alignment
    POJ 3267 The Cow Lexicon
    UVa 1620 懒惰的苏珊(逆序数)
    POJ 1018 Communication System(DP)
    UVa 1347 旅行
    UVa 437 巴比伦塔
    UVa 1025 城市里的间谍
  • 原文地址:https://www.cnblogs.com/abc8023/p/7782181.html
Copyright © 2011-2022 走看看