Question

我想上传图片，我的代码已经设置好，因此当我打开图片时，它会立即发送XMLHttpRequest并上传图片。

现在，我需要对此进行更改，并使用类型为submit的其他按钮。但是，一旦执行此操作，该图像似乎就无法正确加载。

这是表格：

<form id="profileImgForm">                      
    <input type="file" name="fileToUpload" id="fileToUpload">
    <input type="submit" value="Finalize Upload">
</form>

这是使用onchange作为方法的javascript：

var imgfile = "";

document.getElementById("profileImgForm").onchange = function(e) {
    e.preventDefault(); 
    if(e.target.files.length > 0) {
        imgfile = e.target.files[0];
    }
}

这有效，但是我需要对onsubmit做出反应。但是，如果我将其更改为onsubmit，将不再找到该图像文件。

我在fileToUpload输入中打开图像，然后单击“提交”按钮。但是，现在出现类似cannot read property 'length' of undefined的错误，这意味着由于某种原因找不到图像文件。

有人知道为什么在使用onsubmit时这不再起作用了，我如何获得图像文件。感谢您的帮助！

Answer 1

对于onchange，e.target是文件输入元素，但是对于onsubmit，e.target是整个表单。您可以使用e.target[0].files[0]或按其ID获取文件输入元素。

在表单中使用onsubmit而不是onchange时无法获取图像

1 个答案: