vue+Hbuilder 二维码扫码功能的实现

最新推荐文章于 2024-08-19 18:48:10 发布

杨园园的微博

最新推荐文章于 2024-08-19 18:48:10 发布

阅读量9.4k

点赞数 2

分类专栏： vue

本文链接：https://blog.csdn.net/rosy_yang/article/details/82114360

版权

vue 专栏收录该内容

19 篇文章 1 订阅

订阅专栏

此代码须建立在Hbuilder上
代码如下：只有真机运行才能起作用

<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="utf-8">
  <meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no" />

  <title>XXXXX</title>


  <style type="text/css">
    *{ -webkit-user-select: none;}
    html,body{
      margin: 0px;
      padding: 0px;
      height: 100%;
    }
    #bcid {
      background:#0F0;
      height:480px;
      width:360px;
    }
  </style>

  <script type="text/javascript" >
      // 扩展API加载完毕后调用onPlusReady回调函数
      document.addEventListener( "plusready", onPlusReady, false );
      // 扩展API加载完毕，现在可以正常调用扩展API
      function onPlusReady() {
          var e = document.getElementById("scan");
          e.removeAttribute( "disabled" );
      }
      var scan = null;
      function onmarked( type, result ) {
          var text = '未知: ';
          switch(type){
              case plus.barcode.QR:
                  text = 'QR: ';
                  break;
              case plus.barcode.EAN13:
                  text = 'EAN13: ';
                  break;
              case plus.barcode.EAN8:
                  text = 'EAN8: ';
                  break;
          }
          alert( text+result );
      }
      function startRecognize() {
          scan = new plus.barcode.Barcode('bcid');
          scan.onmarked = onmarked;
      }
      function startScan() {
          scan.start();
      }
      function cancelScan() {
          scan.cancel();
      }
      function setFlash() {
          scan.setFlash();
      }


      function startRecognize() {
          console.log("333333333333333");
          scan = new plus.barcode.Barcode('bcid');
          scan.onmarked = onmarked;
          this.startScan
      }
     function startScan () {
          scan.start();
      }
  </script>
</head>
<body>
<div>扫码功能</div>
<input type='button' onclick='startRecognize()' value='创建扫描控件' />
<input type='button' onclick='startScan()' value='开始扫描' />
<input type='button' onclick='cancelScan()' value='取消扫描' />
<input type='button' onclick='setFlash()' value='开启闪光灯' />
<div id= "bcid"></div>
<input type='text' id='text'/>
<!--<div id="app"></div>-->
<script src="../dist/build.js"></script>
<script type="text/javascript" src="http://api.map.baidu.com/api?v=2.0&ak=3mn83YpfI9VdPSZg1DfuK7lg0UqRljwt"></script>
</body>
</html>