jquery.qrcode.js 前端也能產生QRCode

 現在QRCode已經越來越流行了，從最簡單的掃描QRCode來取得網址，到利用QRCode完成報到程序等等；現在生活周遭已經到處都有機會看得到QRCode了，因此身為前端工程師，勢必會有越來越多機會在前端打上QRCode的圖片，今天就來介紹一款簡單易用的QRCode library吧！

關於jquery.qrcode.js

從名稱就很容易可以猜出，jquery.qrcode.js是一款用來產生QRCode的jquery plugin，因此要使用前記得先加入jquery才行。

使用jquery.qrcode.js

首先先方上一個<div>標籤

<div id="qrcode"></div>

接著加入JavaScript

$('#qrcode').qrcode('http://www.google.com');

完成！簡單到我都覺得這篇文章有灌水嫌疑了XD

進階使用jquery.qrcode.js

預設jquery.qrcode.js是使用HTML5的canvas來完成，但舊版IE不支援canvas，因此若有需要支援舊版瀏覽器需求的話，可以加上render: table參數

$('#qrcode-table').qrcode({
	render: 'table',
  text: 'http://www.google.com'
});

如果需要指定大小(預設是256x256)也可以加入width及height參數，不過常跟寬記得設成一樣，因為QRCode都是正方形的，說長寬設為長方形則會出破圖現象

$('#qrcode-size').qrcode({
	width: 120,
  height: 120,
  text: 'http://www.google.com'
});

資料來源：https://ithelp.ithome.com.tw/articles/10185571