基于mui,h5+扫描功能

扫描》go~

页面一：点击扫描，接收扫描的数据
页面二：扫描

第一个页面，逻辑不复杂，只是跳转到第二个页面，和接收数据
以及对扫描出来的数据进行判断（每个判断方式都不一样，暂不展示）

function scaned(t, r, f) { //接收数据
				console.log("end sm")
				console.log("ewm:: " + r)//接收到扫描的数据
				
				if(){//判断二维码格式
                                }
			}

			function closeWaiting() {
				console.log("closeWaiting");
			}复制代码

第二个页面html

<div id="bcid">
			<div style="height:40%"></div>
			<p class="tip">...载入中...</p>
		</div>
		<footer>
			<div class="fbt" onclick="back()">取　 消</div>
			<div class="fbt" onclick="scanPicture()">从相册选择二维码</div>
		</footer>复制代码

js  注释都写得很明白，不多解释了

var ws = null,
				wo = null;
			var scan = null,
				domready = false;
			if (window.plus) {
				plusReady();
			} else {
				document.addEventListener('plusready', plusReady, false);
			}
			// 监听DOMContentLoaded事件
			document.addEventListener('DOMContentLoaded', function() {
				domready = true;
				plusReady();
			}, false);
			// H5 plus事件处理
			function plusReady() {
				if (ws || !window.plus || !domready) {
					return;
				}
				// 获取窗口对象
				ws = plus.webview.currentWebview();
				wo = ws.opener();
				// 开始扫描
				ws.addEventListener('show', function() {
					scan = new plus.barcode.Barcode('bcid');
					scan.onmarked = onmarked;
					scan.start({
						conserve: true,
						filename: '_doc/barcode/'
					});
				}, false);
				// 显示页面并关闭等待框
				ws.show('pop-in');
				wo.evalJS('closeWaiting()');
			}
			// 二维码扫描成功
			function onmarked(type, result, file) {
				switch (type) {
					case plus.barcode.QR:
						type = 'QR';
						break;
					case plus.barcode.EAN13:
						type = 'EAN13';
						break;
					case plus.barcode.EAN8:
						type = 'EAN8';
						break;
					default:
						type = '其它' + type;
						break;
				}

				result = result.replace(/\n/g, '');
				wo.evalJS("scaned('" + type + "','" + result + "','" + file + "');");
				back();
			}
			// 从相册中选择二维码图片 
			function scanPicture() {
				plus.gallery.pick(function(path) {
					plus.barcode.scan(path, onmarked, function(error) {
						plus.nativeUI.alert('无法识别此图片');
					});
				}, function(err) {
					console.log('Failed: ' + err.message);
				});
			}
			function back(){
				//返回....
			}复制代码

转载于:https://juejin.im/post/5c95d45ce51d4502f42b05ab