Trước tiên bạn chèn đoạn JS này vào trong cặp thẻ <head></head>
<script src='https://cdnjs.cloudflare.com/ajax/libs/qrcodejs/1.0.0/qrcode.min.js'></script>(code-box)
Và dưới đây là đoạn code mẫu để tạo một mã QRcode trong thẻ div có id="qrcode"
HTML:
<input id="text" type-"text"/><div id="qrcode"></div>(code-box)
CSS:
#qrcode {position: relative;height: 200px;width: 200px;border: none;}(code-box)
JavaScript:
<script>var text = document.getElementById('text'); //tạo biến text lấy theo id của ô inputvar qrcode = new QRCode("qrcode"); tạo biến qrcode theo id của thẻ div muốn tạo mã//Hàm tạo qrcodefunction makeCode() {const textCode= text .value; // tạo biến textCode bằng giá trị của biến textqrcode.clear(); //Xóa qrcode cũ đã tạo nếu có.qrcode.makeCode(textCode); //Tạo mã mới theo giá trị của biến textCode}</script>(code-box)
Lưu ý: Đây chỉ là code mẫu và chưa thể thực thi ngay vì nó còn phụ thuộc vào "sự kiện" mà bạn muốn tạo ra QRCode ví dụ như: "click", "keyup", "blur", ... Vì vậy, dựa vào code mẫu bạn có thể tùy biến để đưa hàm tạo mã vào một sự kiện nào đó mà bạn muốn để thực hiện được điều mà bạn mong đợi.
Chúc bạn thành công!