我正在尝试在 android 中使用 phonegap-1.4.1 开发条形码扫描应用程序。我试图将所有值存储在一个数组 code[] 中，稍后我将使用该数组显示这些值。我正在创建值的本地存储。这是我声明的一个数组和一个计数器。
localStorage["counter"]=0;
var code = ["Test1", "Test2","Test3", "Test4"];
localStorage.setItem("code", JSON.stringify(code));
这是我用于扫描条形码的 javascript 文件，我在其中使用递归函数，以便应用程序继续扫描并将值存储在数组中。
var scanCode = function () {
window.plugins.barcodeScanner.scan(
function (result) {
if(result.cancelled == true ) {
window.location.href = 'page5.html';
} else {
var test2 = JSON.parse(localStorage.getItem("code"));
var k = parseInt(localStorage.getItem("counter"));
document.getElementById(test2[k]).innerHTML = "result.text";
k++;
localStorage["counter"] = k;
alert("Scanned Code: " + result.text + ". Format: " + result.format + ". Cancelled: " + result.cancelled);
scanCode();}
}, function (error) {
alert("Scan failed: " + error);
window.location.href = 'page5.html';
});
}
存储值后，我将某些 page5.html 中的值显示为
<tr>
<td >1</td>
<td>
<p id="Test1"></p></td>
</tr>
但我得到的错误是 BarcodeScanner2 = TypeError: Cannot set property 'innerHTML' of null。有人请帮我解决这个问题。提前致谢。
最佳答案
在您的 html 文件中添加以下 javascript 函数(页面顶部)。
function SaveDataToLocalStorage(barcodeValue)
{
var oldItems = JSON.parse(localStorage.getItem('barcodes')) || [];
var newItem = {
'barcode': barcodeValue
};
oldItems.push(newItem);
localStorage.setItem('barcodes', JSON.stringify(oldItems));
}
现在更改您的条形码扫描代码如下:
var scanCode = function () {
window.plugins.barcodeScanner.scan(function (result) {
if(result.cancelled == true ) {
window.location.href = 'page5.html';
} else {
// below function save your data in localstorage.
SaveDataToLocalStorage(result.text);
scanCode();
}
}, function (error) {
alert("Scan failed: " + error);
window.location.href = 'page5.html';
});
}
现在，如果你想显示 page5.html 中的所有条形码，只需从本地存储中读取所有条形码并将其显示在页面中。
使用如下函数page5.html显示page5.html中的所有条码
function displayValues()
{
var oldItems = JSON.parse(localStorage.getItem('barcodes')) || [];
for(var i=oldItems.length-1;i>=0;i--)
{
var html=document.getElementById("allCodes").innerHTML;
document.getElementById("allCodes").innerHTML=html+"<br>"+oldItems[i].barcode;
}
}
在page5.html中制作一个div名称allCodes
你的page5.html
<body>
<div id="allCodes">
</div>
</body>
<script>
function displayValues()
{
var oldItems = JSON.parse(localStorage.getItem('barcodes')) || [];
for(var i=oldItems.length-1;i>=0;i--)
{
var html=document.getElementById("allCodes").innerHTML;
document.getElementById("allCodes").innerHTML=html+"<br>"+oldItems[i].barcode;
}
}
displayValues();
</script>
//显示在表格中:
function displayValues()
{
var oldItems = JSON.parse(localStorage.getItem('barcodes')) || [];
if(oldItems.length>0)
{
document.getElementById("allCodes").innerHTML="<table border='2'>";
}
for(var i=oldItems.length-1;i>=0;i--)
{
var html=document.getElementById("allCodes").innerHTML;
html=html+"<tr><td>"+oldItems[i].barcode+"</td></tr>";
document.getElementById("allCodes").innerHTML=html;
}
if(oldItems.length>0)
{
var old=document.getElementById("allCodes").innerHTML;
document.getElementById("allCodes").innerHTML=old+"</table>"
}
}
关于javascript - BarcodeScanner2 = 类型错误 : Cannot set property 'innerHTML' of null，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/24486207/