未捕获的TypeError:不能读取未定义的属性'name'

I have the following code for when 'choose file' is clicked:

点击“选择文件”时，我有以下代码:

$(':file').change(function () {

if(this.files.length == 1) {
    $('#selected_files').html("<h4>Attaching " + this.files.length + " file</h4>");
} else {
    $('#selected_files').html("<h4>Attaching " + this.files.length + " files</h4>");
}

$('#selected_files').append("<table class=\"altShaded\"><thead><tr><td></td><td>Filename</td><td>Size</td></tr></thead>");

for(x=0;x<=this.files.length;x++)
{
    var file = this.files[x], 
    name = file.name, 
    size = file.size, 
    type = file.type;
    $('#selected_files').append("<tr><td></td><td><b>" + name + "</b> ("+filesize(size)+") " + type + "<br>");
}


});

Fine, right? And all works well. That's great, except that when jQuery appends the table rows, it seems to like to start a new table, and the top <thead> isnt attached the to rows (in Chrome).

很好,对吧?,一切顺利。这很好，但是当jQuery追加表行时，它似乎喜欢启动一个新表，而顶部不附加到行(在Chrome中)。

Okay I thought, we'll just build a string and put it all in at once.

好吧，我想，我们先建立一个字符串，然后把所有的都放在一起。

Thus:

因此:

$(':file').change(function () {

        if(this.files.length == 1) {
            var displayFiles = "<h4>Attaching " + this.files.length + " file</h4>";
        } else {
            var displayFiles = "<h4>Attaching " + this.files.length + " files</h4>";
        }


        var displayFiles = displayFiles + "<table class=\"altShaded\"><thead><tr><td></td><td>Filename</td><td>Size</td></tr></thead>";
        for(x=0;x<=this.files.length;x++)
        {
            var file = this.files[x], 
            name = file.name, 
            size = file.size, 
            type = file.type;
            displayFiles = displayFiles + "<tr><td>" + type + "</td><td><b>" + name + "</b></td><td>"+filesize(size)+"</td></tr>";
        }

        $('#selected_files').html(displayFiles);
    });

But now all of a sudden, I get the following error:

但是现在突然，我得到了如下的错误:

*Uncaught TypeError: Cannot read property 'name' of undefined *

*未捕获的TypeError:无法读取未定义的属性'name'

Nothing has changed, except the code around it. It is pointing to:

除了围绕它的代码之外，什么都没有改变。这是指:

name = file.name,

name = file.name,

Can you tell me what the problem is here?

你能告诉我这里有什么问题吗?

3 个解决方案

#1

This type of error mean that your container variable fileis not defined.

这种类型的错误意味着您的容器变量文件没有定义。

You should use console.log at different places to see what is defined and what is not (your files array, etc.)

您应该使用控制台。在不同的地方进行日志记录，查看定义了什么，不定义了什么(文件数组等)

Also :

另外:

for(x=0;x<=this.files.length;x++)

Will be undefined for the last x value, because the last element of an array is at array.length - 1and not array.length, that gives you an undefined value at the end of your loop, probably the source of your error. In your case, x goes to the value this.files.length Also, always use var, otherwise your xwill be a global variable, which can be another source of problems.

将为最后一个x值不定义，因为数组的最后一个元素是在数组中。长度- 1而不是数组。长度，在循环结束时给您一个未定义的值，可能是错误的根源。在你的例子中，x的值是this.files。长度也总是使用var，否则你的x将是一个全局变量，这可能是另一个问题的来源。

A correct loop should be :

正确的循环应该是:

for (var x = 0; x < this.files.length; x++)

#2

Here is the code with the problem,

这是有问题的代码，

for (var index = 0; index <= results.length; index++) {
//doSumthing
}

Working code ,

工作代码,

for (var index = 0; index < results.length; index++) {
//doSumthing
}

The problem was with the = operator in for loop statement. It was checking for the element that does not exist(last element+1) in the array.

问题是for循环语句中的=运算符。它检查数组中不存在的元素(最后一个元素+1)。

Try removing = from your loop statement, like this.

尝试从循环语句中删除=，如下所示。

for(var x = 0; x < this.files.length; x++){}

It might work!

它可能工作!

#3

I was having same error and it was happening because of a stupid mistake. I removed on module from imports array and accidentally left comma on that line.....so there were two commas (,,) in imports: [] array....after removing one comma it solved the problem.

我犯了同样的错误，这是因为一个愚蠢的错误。我从导入数组中取出了模块，不小心在流程中留下了逗号……所以有两个逗号(,)进口:[]数组....去掉一个逗号后，问题就解决了。

#1