on file事件的变更事件

Question

我有4个文件输入,我希望它们的值在更改时触发上传进程.我的意思是当您选择图片并单击选择图像对话框上的打开时,将触发上传图片的脚本.我使用过onchange事件,但我认为这不是正确的事件:

JS:

$("input[type=file]").on('change',function(){
    alert(this.val());//I mean name of the file
});

HTML:

<div class="form-group col-md-11 col-md-offset-1">
    <input type="file" name="photos[]">
    <input type="file" name="photos[]">
    <input type="file" name="photos[]">
    <input type="file" name="photos[]">
</div>

我该怎么办？

Answer 1

这个OnChange活动是个不错的选择.但是,如果用户选择相同的图像,则不会触发该事件,因为当前值与前一个值相同.

例如,图像宽度发生变化,应该上传到服务器.

要防止出现此问题,您可以使用以下代码:

$(document).ready(function(){
    $("input[type=file]").click(function(){
        $(this).val("");
    });

    $("input[type=file]").change(function(){
        alert($(this).val());
    });
});

Answer 2

使用files元素的文件列表而不是val()

$("input[type=file]").on('change',function(){
    alert(this.files[0].name);
});