使用多个输入生成二维码

Question

我目前正在使用这个代码的二维码生成器从一个输入字段：(HTML和Javascript)我希望有多个输入，如客人姓名，活动名称，活动日期，地点作为一个部分，以形成或生成二维码。请注意，活动标题和日期将被填写一次，而客人名称将是多个，因为目标是每个客人都有唯一的二维码。

所以最终的结果应该是事件的标题，日期和位置以及二维码将作为1张照片嵌入。这有可能吗？

谢谢-Tarneem

​

var qrcode = new QRCode("qrcode");

function makeCode () {      
    var elText = document.getElementById("text");
    
    if (!elText.value) {
        elText.focus();
        return;
    }
    
    qrcode.makeCode(elText.value);
}

makeCode();

$("#text").
    on("blur", function () {
        makeCode();
    }).
    on("keydown", function (e) {
        if (e.keyCode == 13) {
            makeCode();
        }
    });

                  <input id="text" type="text" placeholder="Enter guest name"  class="contactField" /><br />
 <div id="qrcode" ></div>

​

Answer 1

是的，实际上这很简单，只需将它们连接起来：

var location = 'exampleLocation';
// Some other information or methods how you get the info here 

var qrCodeString = location+ ', ' +$('#name').val();
qrcode.makeCode(elText.value( qrCodeString );

你的代码不会显示你从哪里获取位置和事件信息，但你可以将它们添加到QR生成器中。According to this answer字符串的最大长度约为4.000个字符。

Answer 2

使用qrcode库https://www.npmjs.com/package/qrcode

var QRCode = require('qrcode')

let qrcod_url = await QRCode.toDataURL([
{ data: 'Confidential \n', mode: 'byte' },
{ data: `Date: ${moment(created_at).format('MM-DD-YYYY')}\n`, mode: 'byte'},
{ data: `Gender : ${customerGender}\n`, mode: 'byte' },
])