2009-06-19 13 views
64

C'è un modo per impostare il valore di un file input (<input type="file" />) o è tutto bloccato per sicurezza? Sto cercando di utilizzare openFiles di google gears per creare un semplice multi-uploader.Imposta dinamicamente il valore di un input di file

Nota:

La risposta (s) di seguito riflettono lo stato dei browser legacy nel 2009. Ora si può effettivamente impostare il valore dell'elemento file di input in modo dinamico/programatically utilizzando JavaScript nel 2017.

vedere la risposta in questa domanda per i dettagli, nonché una demo:
How to set file input value programatically (i.e.: when drag-dropping files)?

+1

Sono abbastanza sicuro che hai ragione e file di campi di input sono di sola lettura –

+3

Ho fatto una risposta completa e aggiornata (dec 2013) a questo proposito qui: [Memorizza e ripeti l'input del file] (http://stackoverflow.com/a/20537822/588079) – GitaarLAB

+1

Riapri. 62 + 62 upvotes (per non parlare di +15 segnalibri) significa più di qualche opinione strana di qualcuno – Green

risposta

65

non è possibile Dyna cambiate micidamente il valore di un campo file, altrimenti potreste impostarlo su "c: \ yourfile" e rubare i file molto facilmente.

Tuttavia ci sono molte soluzioni per un sistema multi-caricamento. Immagino che tu voglia avere una finestra di dialogo aperta a selezione multipla.

Forse dare un'occhiata a http://www.plupload.com/ - è una soluzione molto flessibile per più caricamenti di file e supporta le zone di rilascio e.t.c.

+1

Qualcuno ha sostituito l'URL con uno che funziona. – JohnK

+0

Penso che questa risposta sia obsoleta. Non è più possibile impostare un file predefinito, in quanto potrebbe essere letto attraverso l'API FileReader e inviato da XHR. Il fatto che 'input.files' sia di sola lettura è probabilmente una questione di eredità. –

+0

Considerando la domanda è "C'è un modo per impostare il valore di un file di input"? E la risposta dice "Non è possibile" .. risposta ancora perfettamente valida no? Che cosa ha a che fare con l'API FileReader o XHR? – Joel

0

Ho avuto un problema simile, quindi ho provato a scrivere questo da JavaScript e funziona! : referenceToYourInputFile.value = "" ;

+4

In che modo questo "funziona"? Il [Mozilla Docs] (https://developer.mozilla.org/en-US/docs/Web/HTML/Element/input#File_inputs) afferma esplicitamente: "Non puoi impostare il valore di un selettore di file da uno script ; fare qualcosa come [questo] non ha alcun effetto " – MrWhite

+6

... a parte _clearing_ la selezione del file. – MrWhite

+2

La domanda riguarda l'impostazione del valore di un input di file, non la cancellazione. –

2

Sto lavorando su un'app js angolare e ho riscontrato un problema simile. Quello che ho fatto è stato visualizzare l'immagine dal db, quindi ho creato un pulsante per rimuovere o mantenere l'immagine corrente. Se l'utente ha deciso di mantenere l'immagine corrente, ho modificato l'attributo ng-submit in un'altra funzione che non richiede la convalida dell'immagine e ha aggiornato il record nel db senza toccare il nome del percorso dell'immagine originale. La funzione remove image ha anche cambiato il valore dell'attributo ng-submit su una funzione che invia il modulo e include la convalida e il caricamento dell'immagine. Anche un po 'di javascript per far scorrere in vista per caricare una nuova immagine.

-1

ho finito per fare qualcosa di simile per AngularJS in caso qualcuno si imbatte in questa domanda:

const imageElem = angular.element('#awardImg'); 

if (imageElem[0].files[0]) 
    vm.award.imageElem = imageElem; 
    vm.award.image = imageElem[0].files[0]; 

E poi:

if (vm.award.imageElem) 
    $('#awardImg').replaceWith(vm.award.imageElem); 
    delete vm.award.imageElem; 
Problemi correlati