【问题标题】:JsBarcode options does not work with jQueryJsBarcode 选项不适用于 jQuery
【发布时间】:2022-01-07 18:49:20
【问题描述】:

我正在使用 jQuery 生成条形码并尝试添加大小选项,但它不起作用。 https://codepen.io/lindell/pen/mPvLXx?editors=1010 的演示对我不起作用,因为我使用 php 循环遍历项目,然后再次循环以生成条形码。

<!DOCTYPE html>
<html>
<meta http-equiv="content-type" content="text/html;charset=utf-8" />
<head>
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
  <link rel="stylesheet" href="https://www.ssms.anrcorporation.com/assets/bower_components/bootstrap/dist/css/bootstrap.min.css">
  <script src="https://www.ssms.anrcorporation.com/assets/bower_components/jquery/dist/jquery.min.js"></script>
  <script src="https://unpkg.com/jsbarcode@latest/dist/JsBarcode.all.min.js">
  </script>
</head>
<body>

<div class="container bg-white">
    <?php if(!empty($items)){ foreach($items as $row){ ?>
        <svg id="<?= $row['sn']; ?>"></svg>
    <?php }} ?>
</div>

<script>
$(document).ready(function(){
    const items = <?= !empty($items) ? json_encode($items) : json_encode([]); ?>;
    if(items){
        items.map(item => {
            $(`#${item.sn}`).JsBarcode(`SSN : ${item.sn}`)
            .options({font: "OCR-B", height: 25, width: 35})
            .render();
        })
    }
})
</script>

<script src="https://www.ssms.anrcorporation.com/assets/bower_components/jquery-ui/jquery-ui.min.js"></script>
<script src="https://www.ssms.anrcorporation.com/assets/bower_components/bootstrap/dist/js/bootstrap.min.js"></script>
</body>

【问题讨论】:

  • 可以给我们看看 PHP 渲染的 html 吗?也许这样做你可以发现问题。
  • 另外,尺寸选项是什么意思?是fontSize、height和width吗?
  • 如何添加尺寸?您的问题中似乎没有显示它

标签: php jquery jsbarcode


【解决方案1】:

您的问题不清楚,但如果您的意思是 fontSizeheightwidth 等,请尝试以下操作:

$(`#barcode1`).JsBarcode(`SSN : 12341234`, {fontSize: 6, height: 20, width: 1, font: "OCR-B"});

【讨论】:

  • 谢谢,这确实有效。起初我是这样做的,但由于某种原因,显示器一团糟。你知道这个库中使用什么单位来确定大小吗?把宽度 = 1 很好,但我希望它是 35 毫米,但我只是不知道如何以毫米测量调整它的大小。
猜你喜欢
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 2017-06-10
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
相关资源
最近更新 更多