logo TTVONE.COM

[วิดีโอสอน] Javascript กับการสร้าง QRcode แบบง่ายๆโดยใช้ qrcode.js

poster
http://www.techiesmartstore.com/blog/wp-content/uploads/2013/05/qr-codes.jpg

เป็นการสร้าง QRcode โดยใช้ javascript library ชื่อ qrcode.js โดยสามารถเข้าไปโหลดได้ที่ https://davidshimjs.github.io/qrcodejs/ เป็นการสอนแบบง่ายๆ นะครับ ลองเอาไปประยุกต์กับโปรเจคของท่านดูครับผม

ตัวอย่างโค๊ด :

<!DOCTYPE html>
<html lang="en">
    <head>
        <meta charset="UTF-8">
        <title>Javascript กับการสร้าง QRcode แบบง่ายๆโดยใช้ qrcode.js</title>
        <script src="qrcode.min.js"></script>
    </head>
    <body>
        <input type="text" name="textQrcode" id="textQrcode">
        <button onclick="createQRcode()">สร้าง QRcode</button>
        <hr>
        <div id="showQRcode"></div>
        <script>
            function createQRcode(){
                var textQrcode = document.getElementById('textQrcode');
                var showQRcode = document.getElementById('showQRcode');
                
                if(textQrcode.value.trim() !== ''){
                    showQRcode.innerHTML = '';
                    new QRCode(showQRcode, textQrcode.value);
                    textQrcode.value = '';
                }
            }
        </script>
    </body>
</html>

 

ตัวอย่าง ผลลัพท์

IMG_0781

ภาพเมื่อสแกนจากโทรศัพท์

 

IMG_0782

แสดงข้อความที่ได้


คุณสามารถโหลด qrcode.js ได้ที่ : https://davidshimjs.github.io/qrcodejs/

Tags : [Javascript Programming]
  • ทุกคนมองเห็น
  • 2 ความเห็น
  • 1251 คนเข้าดู

ความเห็นต่อโพส (ล่าสุด)


: ttvone@hotmail.com ความเห็น[729]

ตอบกลับความเห็น : 728 [ 2018-04-10 08:57:04 ]

สุดยอดมากเลยครับ

mid แล้วแต่

ขอบคุณคร้าบบผม

: mid แล้วแต่ ความเห็น[728]

สุดยอดมากเลยครับ

แสดงความเห็นต่อโพส