You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.

69 lines
1.3 KiB

<!DOCTYPE html>
<html>
<head>
<meta name="viewport" content="width=device-width, initial-scale=1">
<style>
body {
background-color: #ccc;
}
#qrtext {
max-width: 512px;
display: block;
margin: 0 auto;
width:80%;
padding: 5px 7px;
border: 1px solid #000;
border-radius: 10px;
background-color: #f0f0f0;
}
#qrcode {
margin: 0 auto;
width:256px;
height:256px;
margin-top:15px;
padding: 10px;
border: 1px solid #000;
border-radius: 10px;
background-color: #f0f0f0;
}
</style>
<script src="qr.js"></script>
<script type="text/javascript">
var qrcode = null;
var qrtext = null;
function init() {
qrtext = document.getElementById("qrtext");
qrcode = new QRCode(document.getElementById("qrcode"), {
correctLevel : QRCode.CorrectLevel.L,
colorDark: '#333',
colorLight: '#f0f0f0'
});
qrtext.focus();
parseLocation();
}
function parseLocation() {
var term = window.location.search || window.location.hash;
if(term.length > 1) {
qrtext.value = decodeURIComponent(term.substring(1));
makeCode(qrtext);
}
}
function makeCode (input) {
if (!input.value) {
qrcode.clear();
input.focus();
return;
}
qrcode.makeCode(input.value);
}
</script>
</head>
<body onload="init()">
<input id="qrtext" type="text" placeholder="Enter text" oninput="makeCode(this)"/>
<br />
<div id="qrcode"></div>
</body>
</html>