【问题标题】:Why Uncaught TypeError: Cannot read property 'length' of undefined?为什么未捕获类型错误:无法读取未定义的属性“长度”?
【发布时间】:2023-12-03 05:45:01
【问题描述】:
<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 等。

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

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

【问题讨论】:

  • 你在 alert(arrData); 的警报中得到了什么?

标签: javascript html filereader


【解决方案1】:

两个字:variable scope

您已经在文件开头定义了certArr,使用

var certArr;

...但是您通过再次使用 var 关键字有效地在您的函数中重新声明它:

var certArr = new Uint8Array(Oribuf);

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

certArr = new Uint8Array(Oribuf);

【讨论】:

    【解决方案2】:

    删除这个变量

    var certArr;
    

    添加该类型变量

    var certArr =  new Uint8Array();
    

    代码开头

    【讨论】: