onChange 事件在选择文件之前触发

Question

所以我有一个 table 是用 JavaScript 从 JSON 生成的。在 table 中有一个文件上传按钮，我需要用它来交换图像（所有图像都在同一个文件夹中，所以我只需要文件名）生成过程是这样的

    ImageClick = document.createElement('input');
    ImageClick.type = "file";
    ImageClick.id = "subida"
    ImageClick.onChange = handleFiles();
    cell.appendChild(ImageClick);

handleFiles 函数

    function handleFiles() {
        const fileList = this.files;
        console.log(fileList[])
}

The result looks like this

所以当 table 生成时，handleFiles 函数会立即触发，甚至在选择文件之前，所以我得到一个

Uncaught TypeError: fileList is undefined

页面加载后立即。如果我尝试使用

加载文件上传元素

filesElement = document.getElementById('subida')

我尝试控制台记录我得到的 filesElement

Uncaught TypeError: filesElement is null.

我一直在网上查找，但找不到答案。我也不能使用 jQuery

Answer 1

这也适用：

    ImageClick.addEventListener("change", function(e) {
            const fileList = e.target.files;
            console.log(fileList);
        });

onChange 事件在选择文件之前触发

onChange event triggers before selecting the file

html

javascript

json

dom

dom-events