Mercurial > qr-html
comparison index.html @ 3:6875be47fb24
Now with less jquery
author | nanaya <me@myconan.net> |
---|---|
date | Sun, 15 Jan 2017 19:17:27 +0900 |
parents | f27dbbc6e978 |
children | cc0a5142a56f |
comparison
equal
deleted
inserted
replaced
2:f27dbbc6e978 | 3:6875be47fb24 |
---|---|
77 | 77 |
78 <a href="https://bitbucket.org/nanaya1/qr-html">Source</a> | 78 <a href="https://bitbucket.org/nanaya1/qr-html">Source</a> |
79 </div> | 79 </div> |
80 </div> | 80 </div> |
81 | 81 |
82 <script src="jquery.min.js"></script> | |
83 <script src="qrcode.min.js"></script> | 82 <script src="qrcode.min.js"></script> |
84 <script src="lodash.min.js"></script> | 83 <script src="lodash.min.js"></script> |
85 | 84 |
86 <script> | 85 <script> |
86 var inputDom = document.getElementsByClassName("js-qr-input")[0] | |
87 var outputDom = document.getElementsByClassName("js-qr-output")[0] | 87 var outputDom = document.getElementsByClassName("js-qr-output")[0] |
88 var qr = new QRCode(outputDom) | 88 var qr = new QRCode(outputDom) |
89 | 89 |
90 var refreshCode = function(e) { | 90 var refreshCode = function() { |
91 var text = e.target.value | 91 var text = inputDom.value |
92 | 92 |
93 if (text !== "") { | 93 if (text !== "") { |
94 qr.makeCode(text) | 94 qr.makeCode(text) |
95 outputDom.classList.remove('js-hidden') | 95 outputDom.classList.remove('js-hidden') |
96 } else { | 96 } else { |
97 outputDom.classList.add('js-hidden') | 97 outputDom.classList.add('js-hidden') |
98 } | 98 } |
99 } | 99 } |
100 | 100 |
101 $(".js-qr-input").on("input", _.debounce(refreshCode, 100)) | 101 inputDom.addEventListener('input', _.debounce(refreshCode, 100)) |
102 refreshCode() | |
102 </script> | 103 </script> |
103 </body> | 104 </body> |