條碼掃描主要還是用於手機掃描二維碼的功能,其他功能也是可以的如:一維碼、二維碼 、條形碼等等
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8"/>
<meta name="viewport" content="initial-scale=1.0, maximum-scale=1.0, user-scalable=no"/>
<title>心得</title>
<script type="text/javascript">
//二維碼掃碼是不需要檢查是否已載入plus,因為用戶得點擊按鈕后才能開始掃碼,在用戶點擊按鈕之前plus早已載入
//創建掃描控件
var scan=null;
function startRecognize() {
//Barcode(某個div的id值,)
document.getElementById("bcid").style.display='block';
scan = new plus.barcode.Barcode('bcid');
scan.onmarked = onmarked; //掃碼成功時回調的函數
scan.onerror = onerror; //掃碼失敗時回調的函數
setTimeout(function(){startScan();},1000);//延遲1秒后開始掃碼(幾乎沒有人在點擊掃碼后剛剛好二維碼就放前面,就算放前面延遲一秒后在掃碼也沒事)
}
//onmarked函數返回兩個值,識別到的條碼類型和識別到的條碼數據
function onmarked(type,result) {
if(type!=0){//不是二維碼
alert('當前掃描到的不是二維碼');
return '';
}
document.getElementById("ewm").innerHTML = result;//掃碼成功后的內容
document.getElementById("bcid").style.display='none';
scan.close();
}
function onerror(cuowu){
alert('掃碼失敗:'+cuowu.message);
}
function startScan(){
scan.start();//開始調用系統攝像頭獲取圖片數據進行掃描識別,當識別出條碼數據時通過onmarked回調函數返回。
}
function cancelScan(){
document.getElementById("bcid").style.display='none';
scan.close();//還是覺得用關閉代替取消比較合適
}
</script>
</head>
<body>
<input type='button' onclick='startRecognize()' value='創建掃描控件' />
<!--input type='button' onclick='startScan()' value='開始掃描' /-->
<input type='button' onclick='cancelScan()' value='取消掃描' />
<div id= "bcid" style="height:500px;width: 100%;background:#333333;display: none;"></div>
<div style="height: 35px;line-height: 35px;" id="ewm">二維碼掃碼顯示區域</div>
</body>
</html>