使用jquery将文件名上传到文本框中

Question

我正在尝试通过 jquery 将上传文件的文件名放入文本框中。如果有单个文件上传按钮应该很容易。

但我将文件输入为数组，每个文件上传按钮旁边都有一个文本框。

我创建了一个小提琴，可以更清楚地演示。问题是我无法在更改功能上获取所选文件的值/名称。

$('.imgupload').on('change', function (e) {
    var filenames = [].slice.call(e.target.files).map(function (f) {
        alert(f.name);
        return f.name;
    });
    $('#filename').val(filenames);
});

JSFiddle -- http://jsfiddle.net/squidraj/Ldcp7hoc/4/

Answer 1

您很接近，但没有输入 id="filename"，您确实有 filename1、filename2 和 data-id 变量。因此，只需抓住data-id 并为相应的输入（第一、第二等）提供等于您正确获得的var filename 的值。

$('#ques_32\\[\\]').on('change', function (e) {
    var filename = [].slice.call(e.target.files).map(function (f) {
        return f.name;
    });
    $('#filename' + $(this).attr("data-id")).val(filename);
});

Updated Fiddle

顺便说一句，你的小提琴中有错字，写的是dataid而不是data-id