jQuery插件jquery-barcode实现条码打印的方法


Posted in Javascript onNovember 25, 2015

本文实例讲述了jQuery插件jquery-barcode实现条码打印的方法。分享给大家供大家参考,具体如下:

这是一个纯js的jQuery插件,项目地址:http://barcode-coder.com/en/barcode-jquery-plugin-201.html

使用示例:

<!doctype html>
<html>
 <head>
  <title>jQuery Barcode</title>
  <script type="text/javascript" src="jquery-1.4.4.min.js"></script>
  <script type="text/javascript" src="jquery-barcode.js"></script>
  <style type="text/css">
  .barcodeImg{margin:10px 0px}
  </style>
 </head>
 <body>
  <div style="margin:10px"> 
   <input id="src" value="11225921991"></input><br/>    
   <input type="button" onclick='code11()' value="code11">  
   <input type="button" onclick='code39()' value="code39"> 
   <input type="button" onclick='code93()' value="code93">
   <input type="button" onclick='code128()' value="code128">
   <input type="button" onclick='ean8()' value="ean8">   
   <input type="button" onclick='ean13()' value="ean13">
   <input type="button" onclick='ean13()' value="std25">
   <input type="button" onclick='int25()' value="int25">
   <input type="button" onclick='msi()' value="msi">
   <input type="button" onclick='datamatrix()' value="datamatrix">
   <div id="bcTarget" class="barcodeImg"></div>   
  </div>
  <script type="text/javascript">
  function code11(){
   $("#bcTarget").empty().barcode($("#src").val(), "code11",{barWidth:2, barHeight:30,showHRI:false});
  }
  function code39(){
   $("#bcTarget").empty().barcode($("#src").val(), "code39",{barWidth:2, barHeight:30,showHRI:false});
  }
  function code93(){
   $("#bcTarget").empty().barcode($("#src").val(), "code93",{barWidth:2, barHeight:30,showHRI:false});
  }
  function code128(){
   $("#bcTarget").empty().barcode($("#src").val(), "code128",{barWidth:1, barHeight:30,showHRI:false});
  }
  function ean8(){
   $("#bcTarget").empty().barcode($("#src").val(), "ean8",{barWidth:2, barHeight:30,showHRI:false});
  }
  function ean13(){
   $("#bcTarget").empty().barcode($("#src").val(), "ean13",{barWidth:2, barHeight:30,showHRI:false});
  }
  function std25(){
   $("#bcTarget").empty().barcode($("#src").val(), "std25",{barWidth:2, barHeight:30,showHRI:false});
  }
  function int25(){
   $("#bcTarget").empty().barcode($("#src").val(), "int25",{barWidth:2, barHeight:30,showHRI:false});
  }
  function msi(){
   $("#bcTarget").empty().barcode($("#src").val(), "msi",{barWidth:2, barHeight:30,showHRI:false});
  }
  function datamatrix(){
   $("#bcTarget").empty().barcode($("#src").val(), "datamatrix",{barWidth:2, barHeight:30,showHRI:false});
  }
  </script>
 </body>
</html>

运行效果截图如下:

jQuery插件jquery-barcode实现条码打印的方法

完整实例代码代码点击此处本站下载。

希望本文所述对大家jQuery程序设计有所帮助。

Javascript 相关文章推荐
网页整体变灰白色(兼容各浏览器)实例
Apr 21 Javascript
js 时间函数应用加、减、比较、格式转换的示例代码
Aug 23 Javascript
jquery.form.js实现将form提交转为ajax方式提交的方法
Apr 07 Javascript
RequireJS入门一之实现第一个例子
Sep 30 Javascript
jQuery往返城市和日期查询实例讲解
Oct 09 Javascript
JavaScript简单实现鼠标移动切换图片的方法
Feb 23 Javascript
又一枚精彩的弹幕效果jQuery实现
Jul 25 Javascript
浅谈 Vue v-model指令的实现原理
Jun 08 Javascript
浅谈JS中的反柯里化( uncurrying)
Aug 17 Javascript
vue中eventbus被多次触发以及踩过的坑
Dec 02 Javascript
详解js类型判断
May 22 Javascript
如何在Angular应用中创建包含组件方法示例
Mar 23 Javascript
JavaScript编写简单的计算器
Nov 25 #Javascript
HTML5 Shiv完美解决IE(IE6/IE7/IE8)不兼容HTML5标签的方法
Nov 25 #Javascript
jQuery插件formValidator自定义函数扩展功能实例详解
Nov 25 #Javascript
jQuery实现鼠标双击Table单元格变成文本框及输入内容后更新到数据库的方法
Nov 25 #Javascript
基于jQuery实现响应式圆形图片轮播特效
Nov 25 #Javascript
jquery+css实现动感的图片切换效果
Nov 25 #Javascript
基于jQuery实现拖拽图标到回收站并删除功能
Nov 25 #Javascript
You might like
PHP5/ZendEngine2的改进
2006/10/09 PHP
PHP+AJAX实现无刷新注册(带用户名实时检测)
2007/01/02 PHP
PHP Ajax实现页面无刷新发表评论
2007/01/02 PHP
PHP使用gmdate实现将一个UNIX 时间格式化成GMT文本的方法
2015/03/19 PHP
实例讲解PHP验证邮箱是否合格
2019/01/28 PHP
laravel5.0在linux下解决.htaccess无效和去除index.php的问题
2019/10/16 PHP
你可能不再需要JQUERY
2021/03/09 Javascript
浅析JavaScript中的常用算法与函数
2013/11/21 Javascript
javascript使用百度地图api和html5特性获取浏览器位置
2014/01/10 Javascript
JS对文本框值的判断示例
2014/03/10 Javascript
JavaScript中exec函数用法实例分析
2015/06/08 Javascript
谈谈jQuery Ajax用法详解
2015/11/27 Javascript
js实现HashTable(哈希表)的实例分析
2016/11/21 Javascript
详解vue-cli快速构建项目以及引入bootstrap、jq
2017/05/26 Javascript
微信小程序自定义顶部组件customHeader的示例代码
2020/06/03 Javascript
原生JS利用transform实现banner的无限滚动示例代码
2020/06/15 Javascript
[01:15:36]加油刀塔第二期网络版
2014/08/09 DOTA
Python工程师面试题 与Python Web相关
2016/01/14 Python
轻松实现python搭建微信公众平台
2016/02/16 Python
浅谈python中的实例方法、类方法和静态方法
2017/02/17 Python
Python使用遗传算法解决最大流问题
2018/01/29 Python
Python使用matplotlib简单绘图示例
2018/02/01 Python
python构建深度神经网络(续)
2018/03/10 Python
用Pelican搭建一个极简静态博客系统过程解析
2019/08/22 Python
Python实现异步IO的示例
2020/11/05 Python
Python 实现一个简单的web服务器
2021/01/03 Python
Under Armour西班牙官网:美国知名的高端功能性运动品牌
2018/12/12 全球购物
会计核算科岗位职责
2014/03/19 职场文书
生产文员岗位职责
2014/04/05 职场文书
党代会心得体会
2014/09/04 职场文书
社区务虚会发言材料
2014/10/20 职场文书
离婚协议书范文2015
2015/01/26 职场文书
关于运动会的广播稿
2015/08/19 职场文书
机关干部作风整顿心得体会
2016/01/22 职场文书
CSS中em的正确打开方式详解
2021/04/08 HTML / CSS
Centos7中MySQL数据库使用mysqldump进行每日自动备份的编写
2021/08/02 MySQL