文件上传时的事件绑定

时间:2013-04-12 15:23:34

标签: javascript jquery html file-upload

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

enter image description here

1 个答案:

答案 0 :(得分:6)

在这种情况下,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>的末尾。