文件上传事件绑定答案

【问题标题】：Event binding on file upload文件上传事件绑定
【发布时间】：2013-04-12 15:23:34
【问题描述】：

有没有办法在用户选择要上传的文件并点击“打开”时绑定事件，我想在用户点击打开时触发事件。

【问题讨论】：

该字段的更改事件应该在那个场合触发
可以复制。检查这个stackoverflow.com/questions/4096335/…

【解决方案1】：

在这种情况下，change 事件将被触发。

如果你有这个 HTML：

<input type="file" id="fileInput" />

然后使用这个JS：

window.onload = function () {
    document.getElementById("fileInput").onchange = function () {
        // this.value
    };
};

（可以选择使用addEventListener/attachEvent 而不是设置onclick 属性）

在处理程序中，您可以使用this.value 来选择文件。

当然，使用 jQuery，你可以使用：

$(document).ready(function () {
    $("#fileInput").on("change", function () {
        // this.value OR $(this).val()
    });
});

注意： window.onload 和 $(document).ready 处理程序用于确保元素可用。当然，这个事件可能比实际需要的时间晚得多，因为它们等待页面上的所有元素都准备好（而window.onload 等待加载图像等内容的时间更长）。一种选择是将onchange 处理程序绑定在页面上的元素之后或<body> 的末尾。

【讨论】：

window 的onload 包装器是相当不必要的，如果脚本被放置在页面的末尾/输入元素之后。 =]
@FabrícioMatté 是的，但我不喜欢这样做，而且它基本上与在身体末端是一样的（window.onload 有点不同，但仍然如此）。而且我并不完全发现与这个问题相关的重要。尽管如此，我会在答案中添加一些关于它的花絮。谢谢:)