HTML5+规范：barcode(条码扫描)

参考资料： http://blog.csdn.net/qq_27626333/article/details/51815121

今天做了个html5调用摄像头访问二维码的功能，调了一天终于通啦，嘎嘎：
步骤：
1、下载mui.min.js，放在项目中
2、index.html页面引用：

 <script src="Scripts/mui.min.js"></script>

3、tab-ScanCode.html页面代码：

<ion-view class="tzgg" hide-nav-bar="true"> 
    <ion-content class="erweima">
        <div class="module">
            <div class="content">               
                <div>
                    <div id="bcid"></div>
                </div>              
            </div>
        </div>
    </ion-content>  
<div class="fixbtn">    
        <span ng-click="cancelScanDo()"><i class="ion-ios-barcode-outline" id="cancelScan" ></i ><b>取消扫描</b></span>
    </div>
</ion-view>

4、ScanCodeCtrl代码：

ctr.controller('ScanCodeCtrl', ['$scope', '$location', 'dataService', '$window', '$ionicPopup', '$ionicBackdrop', function($scope, $location, dataService, $window, $ionicPopup, $ionicBackdrop) {
    setStyle();
    //mui初始化
    mui.init();
    //  mui.init({
    //      swipeBack: true //启用右滑关闭功能
    //  });
    var scan = null;
    var isOpen = false; // 闪光灯是否开始标志 true:闪光灯已经开启 false:闪光灯关闭
    // 条码识别成功事件
    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);
        //关闭界面，返回首页
        scan.close(); //关闭扫描scan    
        $window.location.href = "#/tab/shouye";
    }
    // 创建扫描控件
    function startRecognize() {     
        scan = new plus.barcode.Barcode('bcid');
        //scan.start();     
        scan.onmarked = onmarked;
    }

    function setStyle() {       
        $("#bcid").width($(window).width());
        $("#bcid").height($(window).height() - 70);
    }

    // 开始扫描
    function StartDo() {
        startRecognize();
        scan.start();
    }
    //开始扫描
    $scope.$on('$ionicView.afterEnter', function() {  
        StartDo();
    })
    //取消扫描
    $scope.cancelScanDo = function() {
            if(scan != null) {
                scan.close(); //关闭扫描scan    
            }
            $window.location.href = "#/tab/shouye";
    }       
}])

注：以下代码很重要，如果不加$scope.$on('$ionicView.afterEnter', function() { }）；的话，第一次可以显示扫描的摄像头，第二次再点击，则不显示了。加上上面的代码即可了。具体的也没太搞懂，貌似是页面加载完成后再执行的东西。

//开始扫描
    $scope.$on('$ionicView.afterEnter', function() {  
        StartDo();
    })