为什么Uncaught TypeError:无法读取未定义的属性'length'?

时间:2014-12-17 05:47:24

标签: javascript html5 filereader

<html>
    <head>
        <meta charset="utf-8">
        <script src="dist/localforage.js"></script>
        <script type="text/javascript">
        "use strict"
        var value1;
        var $id = function(id) { return document.getElementById(id); }
        var certArr;        
        window.onload = function()
        {
            $id("read-button").addEventListener("change", onChangeFile, false);
        };      
        function onChangeFile(e) {
            alert("aaaaddffd");
            var file = e.target.files[0];
            var reader = new FileReader();
            reader.onload = function(e) {
                var Oribuf = e.target.result;
                var certArr = new Uint8Array(Oribuf);
                alert(certArr);
            };      
            reader.readAsArrayBuffer(file);     
            alert("aaaa: " + certArr);
            readFile(certArr);
        };      
        function readFile(arrData) {
            // Here. Why this alert Undefined?
            alert("bbbbb: " +arrData);                      
            var key = 'STORE_KEY';
            var r = document.getElementById('results');     
            localforage.setItem('cert1', 1234688, function(err, value) {
                r.innerHTML += 'Saved: ' + value + '<br />';
            });     
            localforage.getItem('cert1', function(err, value) {
                // console.log(value);
                r.innerHTML += 'Read: ' + value + '<br />';
            } );    
            localforage.keys(function(err, keys) {
                r.innerHTML += 'keys: ' + keys + '<br /><br />';
            });             
            // Here. Why Uncaught TypeError: Cannot read property 'length' of undefined?
            // How can I solved this problem. Help me.
            alert(arrData.length);
            alert("aad: " + arrData);
            var text = "";
            for(var i=0;i<arrData.length;i++)
                text += " " + arrData[i];       
            localforage.setItem(key, text, function(e) {
                var tmp_func = function(err, readValue) { r.innerHTML += 'Read: ' + readValue + '<  br />'; };
                r.innerHTML +=   'Saved: ' + text + '<br />';
            });    
            alert("ccccc");
        };    
            function selectCert(sel){
                if(parent.middle.document.getElementById("test").innerHTML == "1")
                    parent.middle.document.getElementById("test").innerHTML = "2";
                else
                    parent.middle.document.getElementById("test").innerHTML = "1";    
                parent.middle.reload();
            }
        </script>
    </head>
    <body>
        <ul>
            <div id="results"></div>
            <input id="read-button" type="file" />
            <li id="qwer" onclick="selectCert(1)">1</li>
            <li id="asdf" onclick="selectCert(2)">2</li>
        </ul>
    </body>
</html>

这是我的HTML 5和JavaScript代码。它使用本地存储,文件API等。

为什么此代码会显示以下错误?

  

未捕获的类型错误:无法读取未定义的属性“长度”

2 个答案:

答案 0 :(得分:0)

两个字:variable scope

您已使用

在文件开头定义了certArr
var certArr;

...但您可以再次使用var关键字在您的函数中重新声明它:

var certArr = new Uint8Array(Oribuf);

要访问全球声明的certArr版本,请移除var关键字:

certArr = new Uint8Array(Oribuf);

答案 1 :(得分:0)

删除此变量

var certArr;

添加此类型变量

var certArr =  new Uint8Array();

代码开头