JavaScript สร้าง QR Code

บทความนี้สอนเขียน JavsScript สร้าง QR Code ด้วย QRCode.js เป็น JavaScript Library สำหรับสร้าง QR Code ง่ายๆ ในตัวอย่างจะเป็นการสร้าง QR Code เมื่อถูกสแกนจะแสดง URL ที่กำหนด มีรายละเอียด และขั้นตอนดังนี้ 

ตัวอย่าง JavaScript สร้าง QR Code

1. เรียกใช้ QRCode.js ผ่าน CDN ด้วยลิงก์ด้านล่าง

<script src="https://cdnjs.cloudflare.com/ajax/libs/qrcodejs/1.0.0/qrcode.min.js"></script>

2. เขียนโค้ดสร้าง QR Code และแสดงที่หน้าเว็บไซต์ด้วย JavaScript

<div id="qrcode"></div>
<script type="text/javascript">
new QRCode(document.getElementById("qrcode"), "https://www.devdit.com/");
</script>

จากตัวอย่างอธิบายได้ดังนี้

1. สร้าง div id เท่ากับ qrcode ซึ่งเป็นพื้นที่สำหรับแสดงรูปภาพ QR Code

2. ใน JavaScript ใช้คำสั่ง QRCode กำหนดพารามิเตอร์ 2 ตัว คือ

2.1 element ที่จะแสดงรูปภาพ QR Code ในตัวอย่างคือ div id เท่ากับ qrcode

2.2 ข้อความ หรือลิงก์ที่จะแสดงเมื่อถูกสแกน ในตัวอย่างคือ "https://www.devdit.com/"

สรุป การสร้าง QR Code ด้วยภาษา JavaScript แนะนำให้ลองใช้ QRCode.js เนื่องจากใช้งานได้ง่าย และรองรับการสร้าง QR Code ได้อย่างมีประสิทธิภาพ