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.

Index.html 1.8 KiB

4 years ago
12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849505152535455565758596061
  1. <!DOCTYPE html>
  2. <html>
  3. <head>
  4. <meta charset="utf-8" />
  5. <meta http-equiv="Content-Type" content="text/html" />
  6. <meta name="viewport" content="width=device-width,initial-scale=1.0,user-scalable=no" />
  7. <title>获取设备摄像头 getUserMedia</title>
  8. <style>
  9. #video {
  10. display: block;
  11. width: 240px;
  12. height: 240px;
  13. background: #000;
  14. border-radius: 5px;
  15. }
  16. </style>
  17. </head>
  18. <body>
  19. <div id="video"></div>
  20. <div>
  21. <button id="open">打开</button>
  22. <button id="close">关闭</button>
  23. </div>
  24. <div id="result"></div>
  25. </body>
  26. <script src="qrscan.js"></script>
  27. <script src="UPNG.js"></script>
  28. <script src="jsQR.js"></script>
  29. <script>
  30. var ds = null;
  31. var scan = new QRScan('video');
  32. document.getElementById('open').onclick = function () {
  33. scan.openScan();
  34. ds = window.setInterval(function () {
  35. startScan();
  36. }, 1500);
  37. };
  38. document.getElementById('close').onclick = function () {
  39. scan.closeScan();
  40. window.clearInterval(ds);
  41. };
  42. var re_div = document.getElementById('result');
  43. function startScan() {
  44. scan.getImgDecode(function (data) {
  45. console.log(data);
  46. var p = document.createElement('p');
  47. if (data.success) {
  48. p.innerHTML = 'RESULT: ' + data.payload;
  49. } else {
  50. p.innerHTML = 'ERROR: ' + data.msg;
  51. }
  52. re_div.appendChild(p);
  53. });
  54. };
  55. </script>
  56. </html>
  57. ————————————————
  58. 版权声明:本文为CSDN博主「onionLxy」的原创文章,遵循 CC 4.0 BY-SA 版权协议,转载请附上原文出处链接及本声明。
  59. 原文链接:https://blog.csdn.net/onionLxy/article/details/96620455