js 打印条形码
相应的文件大家去github上下载吧
https://github.com/lindell/JsBarcode
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<title>条形码</title>
<script type="text/javascript" src="./jquery-3.4.1.min.js"></script>
<script type="text/javascript" src="./JsBarcode.all.js"></script>
<style>
body {
margin: 0;
padding: 0;
}
#pagination {
width: 1190px;
height: auto;
position: relative;
margin: 0 auto;
padding: 0;
}
svg {
margin-right: 12px;
}
</style>
</head>
<body>
<div id="pagination">
<!--可以选择的三种方式，大家可以试试-->
<!--<svg id="svg"> </svg>-->
<!--<canvas id="canvas"></canvas>-->
<!--<img src="" alt="" id="img">-->
</div>
<script>
function addZero(num, length) {
return (Array(length).join('0') + num).slice(-length);
}
function addSvg(j) {
let newSvg = document.createElementNS('http://www.w3.org/2000/svg', 'svg');
newSvg.setAttribute("id", `S${j}`);
newSvg.style["display"] = "inline-block" ;
document.getElementById("pagination").appendChild(newSvg);
}
function toBarcode(ID, name) {
JsBarcode(ID, name, {
format: "CODE128",//选择要使用的条形码类型
width: 2,//设置条之间的宽度
height:40,//高度
displayValue:true,//是否在条形码下方显示文字
font:"Arial",//设置文本的字体
textAlign:"center",//设置文本的水平对齐方式
textPosition:"bottom",//设置文本的垂直位置
textMargin:5,//设置条形码和文本之间的间距
fontSize:15,//设置文本的大小
background: "white",//设置条形码的背景
lineColor: "black",//设置条和文本的颜色。
margin:15//设置条形码周围的空白边距
});
}
function addLength() {
let obj = document.getElementsByTagName("text");
for (let i = 0; i < obj.length; i++) {
obj[i].setAttribute("textLength", "100px");
}
}
for (let j = 1; j < 1001; j++) {
for (let k = 1; k < 4; k++) {
let numStr = "XXXXXX" + addZero(j, 4);
addSvg(numStr);
let ID = `#S${numStr}`;
toBarcode(ID, numStr);
}
}
addLength()
</script>
</body>
</html>
最后通过谷歌浏览器的打印功能打印成pdf 进行打印。
参数选择
js 打印条形码的更多相关文章
- js 打印
关于js打印很简单的一段代码 function doPrint() { var newWindow = window.open("打印窗口", "_blank" ...
- js打印html中的内容
js打印方法 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www. ...
- js打印Iframe中的内容，并且不需要预览。
js打印Iframe中的内容,并且不需要预览 js代码如下: <script type="text/javascript" language="Javascript ...
- js打印
js打印,其实是打印当前页面的内容,是调用 系统的js方法,来弹出 打印设置窗口,用法很简单. window.print()就行,有的考虑到 浏览器兼容性问题,会用到document.execComm ...
- js打印保存用户输入的内容
在用js打印局部页面时,遇到用户新输入的内容没能打印出来,经过观察,发现我采用的js打印方法是读取页面源代码,而用户输入的内容如果不将其写入到页面源代码中去,是打印不出来的,下面是我的解决方法: // ...
- 使用jquery.PrintArea.js打印网页的样式问题
在使用jquery.PrintArea.js打印局部网页样式的时候,发现样式打印不出来,在网上找了好多资料,整理一下分享给大家 一.先看看css的引用文件方式 1.直接在内部的元素中使用”style” ...
- js打印页面指定区域，并去掉页眉上的时间和请求路径
需要通过js打印指定页面的内容 <style media=print type="text/css"> .noprint{visibility:hidden} < ...
- 利用JS打印质数
我爱撸码,撸码使我感到快乐!大家好,我是Counter,今天非常愉快,没有前几天的相对比较复杂的逻辑思维在里面,今天来写写,利用JS打印质数,基本上很多面试,会很经常的考到.那废话不多说,直接上代码: ...
- js生成条形码插件
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...
随机推荐
- js正则实现从一段复杂html代码字符串中匹配并处理特定信息
js正则实现从一段复杂html代码字符串中匹配并处理特定信息 问题: 现在要从一个复杂的html代码字符串(包含各种html标签,数字.中文等信息)中找到某一段特别的信息(被一对“|”包裹着),并对他 ...
- js Date对象和数字对象
<script type="text/javascript"> alert(new Date.toLocaleString()); </script> 以本 ...
- 20199301《Linux内核原理与分析》第十二周作业
ShellShock攻击实验 一.环境搭建 下载 $ sudo su $ wget http://labfile.oss.aliyuncs.com/bash-4.1.tar.gz 安装 $ tar x ...
- PS——使用切片工具切出透明图片
前言 最近有点烦,不说话~ 步骤 首先要保证您的格式为PSD且底色为透明 参考线 标出参考线,方便后面划分 切图 保存 效果
- centos7中，mysql连接报错：1130 - Host ‘118.111.111.111’ is not allowed to connect to this MariaDB server
客户端连接报错 这个问题是因为用户在数据库服务器中的mysql数据库中的user的表中没有权限. 解决步骤 1.连接服务器: mysql -u root -p 2.看当前所有数据库:show data ...
- Spring源码窥探之：@Profile
Spring为我们提供的多环境启动 1. 配置类,注入三个不同环境的数据源,并加上注解 /** * description: 以下准备了三套不同环境的数据源 * * @author 70KG * @d ...
- 手机代理调试Charles Proxy和Fiddler
一.Charles Proxy Charles是一个HTTP代理/HTTP监控/反向代理的工具. 使用它开发者可以查看设备的HTTP和SSL/HTTPS网络请求.返回.HTTP头信息 (cookies ...
- 持续集成学习9 jenkins执行脚本
一.配置 1.首先在slave节点上写一脚本 [root@node1 script]# cat /application/script/test.sh #!/bin/bash echo "h ...
- 好的想法只是OKR的开始--创业者谨记
每一个出版过作品的作家都有这样的体验:有人找到你,说他有一个极妙的想法,并迫不及待的想和你一起实现这个想法:结局也总是差不多,它们艰难的完成了灵感部分,而你只需要简单的把它写成小说,收益则需要五五分成 ...
- Chocolatey 方便的windows 包管理工具
windows 在包管理上一般大家都是网上下载二进制文件或者就是通过软件管家进行安装,这些对于开发人员可能就有点不是 很专业了, Chocolatey 是一个不错的windows 软件包管理工具 安装 ...