如何显示文件名而不是＆＃39;没有选择文件＃39;在jquery fileupload中

Question

我正在使用jquery fileupload来预测asp.net mvc的项目。 它的工作正常，但只有一个问题是，在选择文件后，文件名不显示，仍显示“未选择文件”。 ，如何在“未选择文件”的位置显示文件名。我使用data.files [0] .name获取文件名，但是如何显示，我输入的类型是文件控件。

我的控制权是

 <input type="file" id="ItemImages" accept="image/*" name="uploadfile" data-val="true" data-val-required="please select a file" class="fileupload-new">

我的代码是

 $('imffileuplod').fileupload({
        dataType: 'json',
        dropZone: null,
        url: DomainName + "BackOffice/" + MethodName,
        progressInterval: 10,
        bitrateInterval: 50,
        add: function (e, data) {
            try {

                var imageKbytes = parseFloat(data.files[0].size / 1024);
                var ImageMbytes = parseFloat(imageKbytes) / 1024;
                if (ImageMbytes > parseFloat(2.0)) {
                    $("#errormessage").text("Please upload image upto 2 MB only");
                    return;
                }
                alert(data.files[0].name);

                $("#errormessage").text("");
                $('#progress .bar').text('');
                $('#progress .bar').css('width', '0%');


                $('#progress .bar').show();
               data.submit();

            }
            catch (ex) {
                OpenAlertDialog(ex.message);
            }

        },
        done: function (e, data) {
            $('#progress .bar').css("width", "100%");
            $('#progress .bar').text('100%');

            $("#" + ImageSrcId).attr("src", data.result);

            setTimeout(function () {
                $('#progress .bar').css("width", "0%");
                $('#progress .bar').text('');
            }, 3000);
            // $("#ProgressSpan").text('');

        },
        Fail: function (e) {
        }
    });
}

选择imaage后仍显示“未选择文件”

Answer 1

您无法使用Js更改输入类型文件的值，但可以在其下方使用单独的div并在其中显示文件名。

 if you work with ´jquery 1.8´, the selector ´type=file´ works correctly but if you work with ´jquery 1.6´ this selector will not work. the correct way is to use this type of selectors:

$('input[type="file"]')
or, you can use this type selector, with class:

HTML:

<input class="input-type-file" type="file" name="file_1" enctype="multipart/form-data" />
JS:

$('.input-type-file')