酒吧codeScanner2 =类型错误：无法设置属性“的innerHTML”空的

本文介绍了酒吧codeScanner2 =类型错误：无法设置属性“的innerHTML”空的的处理方法，对大家解决问题具有一定的参考价值，需要的朋友们下面随着小编来一起学习吧！

问题描述

我想开发的Android使用PhoneGap的-1.4.1酒吧code扫描应用程序。我想所有的值存储在一个数组 code [] ，后来我用显示阵列的值。我创建一个本地存储的值。这是我的一个数组，计数器的声明。

I am trying to develop a barcode scanning app using phonegap-1.4.1 in android. I am trying to store all the values in an array code[] and later on I am displaying the values using the array. I am creating a local storage of the values. Here is my declaration of an array and a counter.

localStorage["counter"]=0;
 var code = ["Test1", "Test2","Test3", "Test4"];
 localStorage.setItem("code", JSON.stringify(code));

下面是我的扫描棒code javascript文件和我使用的是递归函数在此，使应用程序扫描继续和值存储在阵列中的

Here is my javascript file for scanning the barcode and I am using an recursive function in this so that the app scanning continues and the values are stored in the array.

 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的值值

And after storing the values I am displaying the values in some page5.html as

                  <tr>
                    <td >1</td>
                    <td>
                      <p id="Test1"></p></td>
                </tr>

但我得到的错误为酒吧codeScanner2 =类型错误：不能设置为空值的特性的innerHTML。有人请帮助我在这个问题上。提前致谢。

But I am getting the error as BarcodeScanner2 = TypeError: Cannot set property 'innerHTML' of null. Somebody please help me on this issue. Thanks in advance.

推荐答案

添加JavaScript函数下面在HTML文件（网页的顶部）。

Add below javascript Function in your html file ( top of the page).

function SaveDataToLocalStorage(barcodeValue)
{

    var oldItems = JSON.parse(localStorage.getItem('barcodes')) || [];
    var newItem = {
        'barcode': barcodeValue
    };
    oldItems.push(newItem);
    localStorage.setItem('barcodes', JSON.stringify(oldItems));

}

现在改变你的吧code扫描code如下：

Now Change Your barcode Scan Code as below :

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显示所有酒吧codeS刚刚从localStorage的阅读栏codeS和页面显示出来。

Now, if you want to display all barcodes in page5.html just read all barcodes from localstorage and display it in page.

使用下面的函数page5.html在page5.html显示所有酒吧codeS

use following function page5.html to display all barcodes in 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;      
    }    
}

做一个div名称所有codeS 在page5.html

make one div name allCodes in page5.html

您page5.html

Your 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>"

    }
}

这篇关于酒吧codeScanner2 =类型错误：无法设置属性“的innerHTML”空的的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持！