mui实现扫一扫二维码功能(必须用hbulider打包)
<!DOCTYPE html> <html> <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>扫码</title> <style type="text/css"> .mask { height: 90%; width: 100%; position: absolute; top: 0; background: #000000; } .mask2 { height: 55px; width: 100%; position: fixed; bottom: 0; background: #000000; } body { margin: 0; background: #000000; } .scan { width: 50%; height: 55px; background: #000; float: left; text-align: center; } .scan img { width: 30px; height: 30px; } .scan span { display: block; color: #fff; font-size: 14px; } </style> </head> <body> <div class="mask" id="mask"> <div class="title" style="width:100%;background:#ccc;"> <div style="padding:.8rem 0;text-indent:1rem;" onclick="scanClose()">返回</div> </div> </div> <div class="mask2" id="mask2"> <div id="scan1" class="scan"> <img src="../image/click.png" /> <span id=""> 相册 </span> </div> <div id="scan2" class="scan"> <img src="../image/scan_off.png" /> <span id=""> 手电筒 </span> </div> </div> <script src="../js/mui.js"></script> <script type="text/javascript"> var scan; if(window.plus) { plusready(); } else { document.addEventListener('plusready', plusready, false); } function onmarked(type, result) { //回调
plus.webview.currentWebview().close();//关闭当前页面
scan.close();//结束后关闭控件
//result是返回结果 } function plusready() { setTimeout(function() { scan = new plus.barcode.Barcode('mask'); scan.onmarked = onmarked; scan.start(); }, 200); //处理返回事件 /* plus.key.addEventListener('backbutton', function() { plus.webview.currentWebview().close(); }) */ } //闪光灯 document.querySelector('#scan2 img').addEventListener('click', function() { if(/scan_off.png/.test(this.src)) { this.src = "../image/scan_on.png"; scan.setFlash(true); } else { this.src = "../image/scan_off.png"; scan.setFlash(false); } }) //添加本地图片 document.querySelector('#scan1 img').addEventListener('click', function() { plus.gallery.pick(function(path) { console.log(path); console.log(JSON.stringify(path)); plus.barcode.scan(path, onmarked, function(error) { plus.nativeUI.alert(JSON.stringify(error)); }); }, function(err) { plus.nativeUI.alert('Failed: ' + err.message); }); }) //关闭窗口 function scanClose(){ plus.webview.currentWebview().close(); javascript:window.history.back(-1); } </script> </body> </html>
1使用的话可以直接点击按钮跳转到这个页面;
2如果需要将扫描结果显示到其他页面个人不建议传参,可以跟要显示的页面合并为一个页面;
3plus对象只能使用hbuilder打包才可以使用;
4公司有安卓,ios的话还是让他们做吧!!!!!!