多次生成带有名称标签和徽标的 QR 码

Question

我需要生成二维码来创建 ID。

我的ID设计如下div：

<div class="row">
    <div class="col-sm-6">
        <table id="tb">
            <tr><th style="font-size: 2em">Name:</th></tr>
            <tr><th style="font-size: 2em">Date of Birth:</th></tr>
            <tr><th style="font-size: 2em" id="qrcode"></th></tr>
        </table>    
    </div>
</div>

我有 2 个文本框。第一个是指定需要的QR数量，第二个是QR中应该编码的文本：

<script src="./jquery.min.js"></script>
<script src="./qrcode.min.js"></script>
<script type="text/javascript">
    var total = $("#number_of_card").val();
    var startingFrom = $("#start_number").val();

    while(total!==0)
    {
        $(this).append('tb')

        var codedId = parseInt(total)+parseInt(startingFrom);
        new QRCode(document.getElementById("qrcode"), ""+codedId);
        total--;
    }
</script>

我使用了以下库：QR Code。

我需要复制所有的div，所以生成的每个二维码都应该有姓名和出生日期div，我无法达到。

完整脚本在这里：

https://jsfiddle.net/w2qgbjLf/

Answer 1

您的 fiddle 出现错误，因此您没有看到 QR，请参阅此 fiddle。

https://jsfiddle.net/gv9dx1sh/16/

var total = $("#number_of_card").val();
var startingFrom = $("#start_number").val();

    while(total !== 0)
    {
      $('body').append(`<div><div>Name:</div><div>BirthDate</div><div id='qrcode${total}'></div></div>`);
      var codedId = parseInt(total)+ parseInt(startingFrom);
      new QRCode(document.getElementById(`qrcode${total}`), "" + codedId);
      total--;
    }

多次生成带有名称标签和徽标的 QR 码

Generate QR Codes several time with name tags and logos

html

javascript

jquery

qr-code