JQuery входной эквивалент

У меня есть простая форма html с одним входом для загрузки файла. (jsfiddle)

В прошлом я получил доступ к файлу, выбранному пользователем с помощью input.files, однако я не понимаю, как это сделать с помощью JQuery;

код:

$(function () {
    $("#cmdSubmit").bind("click", function () {
        var file = document.getElementById("fileInput").files[0];
        alert(file); //A

        file = $("#fileInput").val();
        alert(file); //B

        file = $("#fileInput").files[0];
        alert(file); //C

    });        
});

Опция A дает мне то, что я ожидаю, файловый объект. Однако параметр B просто дает мне имя загруженного файла и (насколько я могу судить) не сам файл.

Опция C показывает, что files - undefined.

Что такое эквивалент JQuery input.files?

Примечание. У меня нет возражений против использования встроенного javascript; но учитывая, что я использую JQuery во всем остальном проекте, я бы предпочел использовать его здесь, если это возможно.

Ответ 1

Вам нужно получить доступ к элементу. Попробуйте:

file = $("#fileInput")[0].files[0];
alert(file); //C

или (спасибо Джек)

file = $("#fileInput").prop('files')[0];
alert(file);

Fiddle

Ответ 2

jQuery не предоставляет оболочку для API файлов. Таким образом, не существует стиля jQuery для этого, по крайней мере, не встроенного в ядро jQuery.

Ваши варианты:

придерживаться опции A
Подождите, пока jQuery включит такую оболочку (они могут не быть)
найти расширение, написанное кем-то другим (если оно существует)
написать расширение самостоятельно

Ответ 3

Попробуйте приведенный ниже код

var file = $("#fileInput").get(0).files[0];
 alert(file);

Спасибо

Ответ 4

$(function () {
    $("#cmdSubmit").bind("click", function () {
       alert(this.files);
     });        
});