jquery条形码生成器
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title></title>
</head>
<body>
<div id="bcTarget"></div>
<!--
JQuery plugin : barcode
Version : 2.0.3
Licence : GPL / Cecill
Date : 2013-01-06
Author: DEMONTE Jean-Baptiste, HOUREZ Jonathan
Download barcode jQuery plugin 2.0.3
Barcode JQuery plugin installation
Like any plugin, just inclure the source file after including that of jQuery.
<script type="text/javascript" src="jquery-1.3.2.min.js"></script>
<script type="text/javascript" src="jquery-barcode.js"></script>
<script type="text/javascript" src="jquery-1.3.2.min.js"></script>
<script type="text/javascript" src="jquery-barcode.js"></script>
Using barcode JQuery plugin
To use this plugin, symply define a Container th host the visuel barcode
<div id="bcTarget"></div>
<div id="bcTarget"></div>
Using example of the plugin
$("#bcTarget").barcode("1234567890128", "ean13");
$("#bcTarget").barcode("1234567890128", "ean13");
Prototype of the barcode function
barcode: function(datas, type, settings)
barcode: function(datas, type, settings)
datas
string
Value barcode (dependent on the type of barcode)
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
member Type
code string
type : std25, int25, code93
member Type
code string
crc boolean
type : msi
member Type
code string
crc boolean
object crc1 : string("mod10", "mod11")
crc2 : string("mod10", "mod11")
type : datamatrix
member Type
code string
rect boolean (default : false)
type (string)
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)
visual configuration of the barcode
Parameter Type Default value Detail Limitation
barWidth int 1 width of a bar 1D
barHeight int 50 container height 1D
moduleSize int 5 largeur / hauteur d'un module 2D
showHRI bool true display text (HRI : Human readable Interpretation)
bgColor text #FFFFFF background color
color text #000000 barcode color
fontSize int 10 font size of the HRI
output text css output type : css, svg, bmp, canvas
renderer : canvas
Parameter Type Default value Detail
posX int 0 X origine
posY int 0 Y origine
Example :
<input type="button" onclick='$("#bcTarget").barcode("1234567890128", "ean13",{barWidth:2, barHeight:30});' value="ean13">
<input type="button" onclick='$("#bcTarget").barcode("1234567890128", "ean13",{barWidth:2, barHeight:30});' value="ean13">
1234567890128
<input type="button" onclick='$("#bcTarget2").barcode("1234567", "int25",{barWidth:2, barHeight:30});' value="int25">
<input type="button" onclick='$("#bcTarget2").barcode("1234567", "int25",{barWidth:2, barHeight:30});' value="int25">
12345670
<input type="button" onclick='$("#bcTarget3").barcode({code: "1234567", crc:false}, "int25",{barWidth:2, barHeight:30});' value="int25 without crc">
<input type="button" onclick='$("#bcTarget3").barcode({code: "1234567", crc:false}, "int25",{barWidth:2, barHeight:30});' value="int25 without crc">
-->
</body>
<script src="js/jquery-1.12.3.min.js" type="text/javascript" charset="utf-8"></script>
<script src="js/jquery-barcode.js" type="text/javascript" charset="utf-8"></script>
<script type="text/javascript">
$("#bcTarget").barcode("1234567890", "int25");
</script>
</html>
用了这个插件发现一个弊端，如果条形码的长度不是统一的，那么无法控制它的宽度，就导致在手机端会出现滚动条，非常恶心。如果规格统一的我觉得用这个插件还是蛮好的 比较清晰。如果是第一种情况的话 建议用https://github.com/lindell/JsBarcode 选择 <img id="barcode"/>这种模式即可
jquery条形码生成器的更多相关文章
- jquery 条形码 插件jquery-barcode使用
转载文章 jquery 条形码 插件jquery-barcode使用 条码官网: http://barcode-coder.com/en/barcode-jquery-plugin-201.htm ...
- 创建条形码图像易用的控制字符编码功能的条形码控件Native Crystal Reports Barcode Generator
Native Crystal Reports Barcode Generator是一个对象,它可以很容易地被嵌入到一个Crystal Report中用于创建条形码图像.一旦此条形码被安装在一个报表中, ...
- JAVA生成扫描条形码
条形码是一种可视化.机器可读的数据,这些数据通常描述了携带该条码的物品的相关信息.条形码已经广泛被应用在商品流通,图书管理,邮政管理和银行系统等领域.在这篇文章中,将介绍如何生成和扫描一些常见的一维和 ...
- JAVA 生成扫描条形码
声明:转载为个人学习收藏,如有侵权,请及时联系本人删除,转载地址:https://www.cnblogs.com/MariaWang/p/10837641.html 条形码是一种可视化.机器可读的数据 ...
- javascript开源大全
javascript开源大全 Ajax框架-jQuery 可视化HTML编辑器-CKEditor 国产jQuery-UI框架-(jUI)-DWZ 网页开发FireFox插件-Firebug 服务器端的 ...
- 图形设计必备软件：CorelDRAW
[CorelDRAW 激发创意] CorelDRAW Graphics Suite 是一款领先的图形设计软件,收到数百万专业人士.小型企业主以及全球设计爱好者的热捧.它可以提供无缝的图形.版面.插图. ...
- 最大开源代码sourceforge 简介 及视音频方面常用的开源代码
所有的音视频凯源代码在这里:http://sourceforge.net/directory/audio-video/os:windows/,你可以下载分析,视频不懂请发邮件给我,帮你分析. 0.视频 ...
- C# 一维码生成
概念 一维条码即指条码条和空的排列规则,常用的一维码的码制包括:EAN码.39码.交叉25码.UPC码.128码.93码,ISBN码,及Codabar(库德巴码)等. 条形码起源于 20 世纪 40 ...
- android 使用开源库zxing生成二维码，扫描二维码【转】
转自:http://blog.csdn.net/qq_16064871/article/details/52422723 zxing是一个开放源码的,用Java实现的多种格式的1D/2D条码图像处理库 ...
随机推荐
- Python3基础 input 输入浮点数，整数，字符串
Python : 3.7.0 OS : Ubuntu 18.04.1 LTS IDE : PyCharm 2018.2.4 Conda ...
- /etc/profile、/etc/bashrc、~/.bash_profile、~/.bashrc 文件的作用
转载自:http://blog.csdn.net/u013968345/article/details/21262033 /etc/profile:此文件为系统的每个用户设置环境信息,当用户第一次登 ...
- thymeleaf和easyui配合可能出现的错误
thymeleaf和easyui 在easyui的内页,不再使用th:href引入静态资源文件. 在easyui页面中,script执行easyui自己的方法要加入: <script th:in ...
- hadoop项目实战--ETL--（三）实现mysql表到HIVE表的全量导入与增量导入
一 在HIVE中创建ETL数据库 ->create database etl; 二 在工程目录下新建MysqlToHive.py 和conf文件夹 在conf文件夹下新建如下文件,最后的工程目录 ...
- 编译安装lamp （php）
用户账号及权限管理 用户账号:'user'@'host' user: 用户名 host: 此用户访问mysqld服务时允许通过哪些主机远程创建连接: host类型:IP.网络地址.主机名.通配符(%和 ...
- sudo: /etc/sudoers is world writable sudo: no valid sudoers sources found, q...
今天操作/etc/sudoers 文件,因为该文件只读,所以sudo chmod 777 /etc/sudoers ,结果可以修改这个文件了,但是导致所有用户的sudo都不能用了 是因为在Linux中 ...
- MongoDB（课时27 消除重复数据）
3.7.2 消除重复数据 在SQL中对于重复的数据可以使用"DISTINCT"消除,在MongoDB中依然支持.(distinct不同的) 范例:查询所有name的信息 本次的操作 ...
- MongoDB（课时22 过期索引）
3.6.2 过期索引 在一些程序的站点会出现若干秒之后信息被删除的情况,例如:手机信息验证码,那么在MongoDB里面可以轻松实现过期索引.但这个时间往往不怎么准确. 范例:设置过期索引(实现过期索引 ...
- django 动态生成CSV文件
CSV (Comma Separated Values),以纯文本形式存储数字和文本数据的存储方式.纯文本意味着该文件是一个字符序列,不含必须像二进制数字那样的数据.CSV文件由任意数目的记录组成,记 ...
- 【Golang 接口自动化06】微信支付md5签名计算及其优化
前言 可能看过我博客的朋友知道我主要是做的支付这一块的测试工作.而我们都知道现在比较流行的支付方式就是微信支付和支付宝支付,当然最近在使用低手续费大力推广的京东金融(已改名为京东数科)以后也可能站到第 ...