root
/
ok-admin
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

add:okBarcode使用方法

master
bobi 2019-11-02 13:53:57 +08:00
parent 07b7378929
commit 0bac0eb878
1 changed files with 45 additions and 12 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

57
pages/tripartite/okBarcode.html
View File

@ -8,24 +8,57 @@
</head>
<body>
<div class="ok-body">
<blockquote class="layui-elem-quote">
<p>创建条形码</p>
</blockquote>
<pre>
layui.use(["okBarcode"], function () {
let $ = layui.jquery;
<br/>
$("#barcode").barcode("153510264086cc8e", "code128", {
output: "css", // 渲染方式 css|bmp|svg|canvas
//bgColor: "#ff0000", // 条码背景颜色
//color: "#00ff00", // 条码颜色
barWidth: 1, // 单条条码宽度
barHeight: 30, // 单体条码高度
// moduleSize: 10, // 条码大小
// posX: 10, // 条码坐标X
// posY: 5, // 条码坐标Y
showHRI: true, // 是否在条码下方显示内容
addQuietZone: false // 是否添加空白区（内边距）
});
});
</pre>
<button type="button" class="layui-btn" id="try">试一下</button>
<br/>
<br/>
<div id="barcode"></div>
</div>
<!--js逻辑-->
<script src="../../lib/layui/layui.js"></script>
<script>
layui.use(["okBarcode"], function () {
layui.use(["code", "okBarcode"], function () {
let code = layui.code;
let $ = layui.jquery;
$("#barcode").barcode("153510264086cc8e", "code128", {
output: 'css', //渲染方式 css/bmp/svg/canvas
//bgColor: '#ff0000', //条码背景颜色
//color: '#00ff00', //条码颜色
barWidth: 1, //单条条码宽度
barHeight: 30, //单体条码高度
// moduleSize: 10, //条码大小
// posX: 10, //条码坐标X
// posY: 5, //条码坐标Y
showHRI: true, //是否在条码下方显示内容
addQuietZone: false //是否添加空白区（内边距）
code({
elem: 'pre',
title: "代码示例"
});
$("#try").click(function () {
$("#barcode").barcode("153510264086cc8e", "code128", {
output: "css", // 渲染方式 css|bmp|svg|canvas
//bgColor: "#ff0000", // 条码背景颜色
//color: "#00ff00", // 条码颜色
barWidth: 1, // 单条条码宽度
barHeight: 30, // 单体条码高度
// moduleSize: 10, // 条码大小
// posX: 10, // 条码坐标X
// posY: 5, // 条码坐标Y
showHRI: true, // 是否在条码下方显示内容
addQuietZone: false // 是否添加空白区（内边距）
});
});
});
</script>