应该是CSS的问题,试试我这个,我这个是OK的,有些你那边没有的代码要删掉
<!DOCTYPE html>
<html>
<!--二维码扫描-->
<head>
<meta charset="utf-8" />
<meta name="viewport" content="initial-scale=1.0, maximum-scale=1.0, user-scalable=no" />
<meta name="HandheldFriendly" content="true" />
<meta name="MobileOptimized" content="320" />
<script src="js/mui.min.js"></script>
<link href="css/mui.min.css" rel="stylesheet" />
<link rel="stylesheet" href="../css/common.css" type="text/css" charset="utf-8" />
<!--<link href="css/qrcode-scan.css" rel="stylesheet"></link>-->
<style>
#bcid {
width: 100%;
position: absolute;
top: 0px;
bottom: 44px;
text-align: center;
}
.tip {
color: #FFFFFF;
font-weight: bold;
text-shadow: 0px -1px #103E5C;
}
</style>
</head>
<body style="background-color: #000000;">
<header class="mui-bar mui-bar-nav myColor" style="padding-top: 10px;">
<a class="mui-action-back mui-icon mui-icon-left-nav mui-pull-left" style="color: #ffffff;"></a>
<h1 id="title" class="mui-title" style="color: #ffffff;">二维码扫描</h1>
</header>
<div class="mui-content">
<div id="bcid">
<div style="height:40%"></div>
<p class="tip">Loading...</p>
</div>
</div>
<script type="text/javascript" src="../js/common.js"></script>
<script type="text/javascript">
mui.init();
var sData,
sTitle,
currentWebview,
opener,
scan,
domready;
mui.plusReady(function() {
//获取传递过来的值,设置顶部标题
sData = plus.webview.currentWebview();
//单据信息返回的顶部标题和type
openedTitle = sData.openedTitle;
sTitle = sData.sendTitle;
if(typeof(openedTitle) != 'undefined') {
sTitle = openedTitle;
}
var title = document.getElementById("title");
title.innerHTML = sTitle;
});
// 开始扫描,H5 plus事件处理
function startScan() {
if(currentWebview || !window.plus || !domready) {
return;
}
// 获取窗口对象
currentWebview = plus.webview.currentWebview();
opener = currentWebview.opener();
// 开始扫描
currentWebview.addEventListener('show', function() {
scan = new plus.barcode.Barcode('bcid');
scan.onmarked = onmarked;
scan.start({
conserve: true,
filename: '_doc/barcode/'
});
}, false);
// 显示页面并关闭等待框
currentWebview.show('pop-in');
}
if(window.plus) {
startScan();
} else {
document.addEventListener('plusready', startScan, false);
}
// 监听DOMContentLoaded事件
document.addEventListener('DOMContentLoaded', function() {
domready = true;
startScan();
}, false);
// 二维码扫描成功的回调函数
function onmarked(type, result, file) {
console.log("0956type=" + type + ",result=" + result + ",file=" + file);
//跳转到单据信息界面
var sendType = sData.type;
var openedType = sData.openedType;
if(typeof(openedType) != 'undefined') {
sendType = openedType;
}
mui.openWindow({
url: "bills-info.html",
id: "bills-info",
extras: {
result: result,
sendTitle: sTitle,
type: sendType,
tag: "scan"
},
createNew: true,
waiting: {
title: 'Loading...', //等待对话框上显示的提示内容
},
show:{
autoShow:false//页面loaded事件发生后自动显示,默认为true(数据加载完成后才关闭加载动画,改善使用效果)
}
});
console.log("1502result=" + result + "title=" + sTitle + "type=" + sendType);
//扫描完成后必须关闭当前页面的barcode,防止返回后无法重新扫描
scan.close();
}
//监听物理返回按键,返回主页
mui.back = function() {
mui.openWindow({
url: "home.html",
id: "home.html",
createNew: true //创建同样id的webview,相当于重新加载页面
});
scan.close();
}
</script>
</body>
</html>