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 相关文章推荐
高性能JavaScript循环语句和条件语句
Jan 20 Javascript
微信小程序中用WebStorm使用LESS
Mar 08 Javascript
响应式框架Bootstrap栅格系统的实例
Dec 19 Javascript
vue实现图片加载完成前的loading组件方法
Feb 05 Javascript
浅谈微信JS-SDK 微信分享接口开发(介绍版)
Aug 15 Javascript
vue中多路由表头吸顶实现的几种布局方式
Apr 12 Javascript
微信小程序云开发 生成带参小程序码流程
May 18 Javascript
浅谈javascript错误处理
Aug 11 Javascript
NProgress显示顶部进度条效果及使用详解
Sep 21 Javascript
Vue 中如何将函数作为 props 传递给组件的实现代码
May 12 Javascript
Element Badge标记的使用方法
Jul 27 Javascript
VUE项目实现主题切换的多种方法
Nov 26 Vue.js
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
php中in_array函数用法分析
2014/11/15 PHP
php 把数字转换成汉字的代码
2015/07/21 PHP
php获取用户真实IP和防刷机制的实例代码
2018/11/28 PHP
JavaScript入门教程(12) js对象化编程
2009/01/31 Javascript
javascript动态加载二
2012/08/22 Javascript
jQuery插件StickUp实现网页导航置顶
2015/04/12 Javascript
JavaScript正则表达式的分组匹配详解
2016/02/13 Javascript
jquery获取复选框的值的简单实例
2016/05/26 Javascript
JavaScript中的boolean布尔值使用学习及相关技巧讲解
2016/05/26 Javascript
AngularJs Forms详解及简单示例
2016/09/01 Javascript
使用Promise链式调用解决多个异步回调的问题
2017/01/15 Javascript
javascript 判断一个对象为数组的方法
2017/05/03 Javascript
利用jQuery+localStorage实现一个简易的计时器示例代码
2017/12/25 jQuery
vue-admin-template配置快捷导航的代码(标签导航栏)
2020/09/04 Javascript
Python Sql数据库增删改查操作简单封装
2016/04/18 Python
python 读取文件并替换字段的实例
2018/07/12 Python
Python编程在flask中模拟进行Restful的CRUD操作
2018/12/28 Python
python实现石头剪刀布小游戏
2021/01/20 Python
PyCharm刷新项目(文件)目录的实现
2020/02/14 Python
Django choices下拉列表绑定实例
2020/03/13 Python
Python面向对象程序设计之类和对象、实例变量、类变量用法分析
2020/03/23 Python
实现Python3数组旋转的3种算法实例
2020/09/16 Python
CSS3图片旋转特效(360/60/-360度)
2013/10/10 HTML / CSS
CSS3制作炫酷的自定义发光文字
2016/03/28 HTML / CSS
YesStyle美国/全球:购买亚洲时装、美容化妆品和生活百货
2017/01/16 全球购物
工作自我评价分享
2013/12/01 职场文书
革命先烈的英雄事迹材料
2014/02/15 职场文书
《梅花魂》教学反思
2014/04/30 职场文书
《陈毅探母》教学反思
2014/05/01 职场文书
2014领导干部学习焦裕禄同志先进事迹思想汇报
2014/09/19 职场文书
小学国庆节活动总结
2015/03/23 职场文书
2015驻村干部工作总结
2015/04/07 职场文书
“爱眼护眼,提前预防近视”倡议书3篇
2019/10/30 职场文书
JavaScript实现简单图片切换
2021/04/29 Javascript
OpenCV-Python实现图像平滑处理操作
2021/06/08 Python
「约定的梦幻岛」作画发布诺曼生日新绘
2022/03/21 日漫