javascript - 多次生成带有名称标签和 Logo 的二维码

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--;
    }