web-dev-qa-db-fra.com

Jquery input.files équivalent

J'ai un simple formulaire html avec une entrée de téléchargement de fichier unique. ( jsfiddle)

Dans le passé, j'ai accédé au fichier sélectionné par l'utilisateur en utilisant input.files, mais je ne sais pas comment procéder avec JQuery;

Code:

$(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

    });        
});​

Option [~ # ~] un [~ # ~] donnez-moi ce que j'attends, un objet fichier. Cependant, l'option [~ # ~] b [~ # ~] me donne simplement le nom du fichier téléchargé et (pour autant que je sache) ) pas le fichier lui-même.

L'option [~ # ~] c [~ # ~] montre que files n'est pas défini.

Quel est l'équivalent Jquery de input.files?

Remarque: je n'ai aucune objection à utiliser du javascript natif; mais étant donné que j'utilise JQuery dans le reste de ce projet, je préférerais l'utiliser ici si possible.

javascriptjqueryfile-upload
21
Mansfield

Vous devez accéder à l'élément. Essayer:

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

ou (merci Jack)

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

Violon

50
Stefan

Essayez le code ci-dessous

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

Merci

3
Sridhar Narasimhan

jQuery ne fournit pas de wrapper pour l'API Files. Il n'y a donc pas de méthode de style jQuery pour le faire, du moins pas intégrée dans le noyau jQuery.

Vos options:

  • coller avec l'option A
  • attendez que jQuery inclue un tel wrapper (ils pourraient ne pas le faire)
  • trouver une extension écrite par quelqu'un d'autre (s'il en existe une)
  • écrire vous-même une extension
3
Quentin
$(function () {
    $("#cmdSubmit").bind("click", function () {
       alert(this.files);
     });        
});​
0
arhea