728x90
자바스크립트에서 QR코드를 그려보자.
이번에 qrcodejs라이브러리를 사용해서 그려보자.
https://davidshimjs.github.io/qrcodejs/
※HTML 소스
<!DOCTYPE html>
<html lang="kr">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>QR code</title>
</head>
<body>
<div id="qrcode"></div>
<script>
const qrcode = new QRCode("qrcode");
const elText = document.getElementById("text");
elText.addEventListener("blur", (e)=> {
makeCode();
});
elText.addEventListener("keydown", (e)=> {
if (e.keyCode == 13) {
makeCode();
}
});
function makeCode () {
if (!elText.value) {
alert("Input a text");
elText.focus();
return;
}
qrcode.makeCode(elText.value);
}
makeCode();
</script>
</body>
</html>
※ 실행화면
728x90
반응형
'Software > JavaScript' 카테고리의 다른 글
| JavaScript 시작하기 - PNG to ICO (1) | 2024.06.14 |
|---|---|
| JavaScript 시작하기 - SVG to PNG (1) | 2024.06.14 |
| Javascript 시작하기 - SVG 디지탈 날짜 및 시계 (0) | 2024.06.14 |
| JavaScript 시작하기 - SVG 디지털시계 (0) | 2024.06.14 |
| JavaScript 시작하기 - 마우스 클릭 한 TD에 DIV 겹치기 (0) | 2024.04.03 |