前端開發:使用JQuery.qrcode來產生QR code吧!
jquery.qrcode.js是純前端的jquery外掛,可以輕鬆在網頁上生產QR code。整支檔案不到3k。最小化之後更是只剩下1點多K。這篇文章要跟大家分享如何使用jquery.qrcode.js。
載入JQuery和jquery.qrcode.js
<script type="text/javascript" src="jquery.min.js"></script> <script type="text/javascript" src="jquery.qrcode.min.js"></script>
建立一個DOM元素,待會兒我們要把QR code放進去。現在我們就建立一個div
<div id="qrcode"></div>
接下來設定jquery.qrcode.js
$('#qrcode').qrcode('this plugin is great');
“this plugin is great"就是QR code的內容。
建立表格格式的QR code:
在預設情況下產生出來的QR code是canvas格式,如果擔心瀏覽器不支援的話、也可以設定table格式
$('#qrcode').qrcode({ render: 'table', text: 'this plugin is great' });
指定QR code的尺寸大小
$('#qrcode').qrcode({width: 64,height: 64,text: 'size doesn't matter'});
產生當前面頁的QR code
$('#qrcode').qrcode({width: 120,height: 120,text: window.location.href});
我要留言