javascript type onchange - Utilizzare jQuery per ottenere il nome file selezionato per l'input del file senza il percorso




6 Answers

var filename = $('input[type=file]').val().split('\\').pop();

oppure puoi semplicemente fare (perché è sempre C:\fakepath che viene aggiunto per motivi di sicurezza):

var filename = $('input[type=file]').val().replace(/C:\\fakepath\\/i, '')
get filename

Ho usato questo:

$('input[type=file]').val()

per ottenere il nome del file selezionato, ma ha restituito il percorso completo, come in "C: \ fakepath \ filename.doc". La parte "fakepath" era effettivamente lì - non so se dovrebbe essere, ma questa è la mia prima volta che lavoro con il nome del file di upload di file.

Come posso ottenere il nome del file (filename.doc)?




Chrome restituisce C:\fakepath\... per motivi di sicurezza: un sito Web non dovrebbe essere in grado di ottenere informazioni sul tuo computer come il percorso di un file sul tuo computer.

Per ottenere solo la parte del nome file di una stringa, puoi usare split() ...

var file = path.split('\\').pop();

jsFiddle .

... o un'espressione regolare ...

var file = path.match(/\\([^\\]+)$/)[1];

jsFiddle .

... o lastIndexOf() ...

var file = path.substr(path.lastIndexOf('\\') + 1);

jsFiddle .




Ecco come lo faccio, funziona abbastanza bene.

Nel tuo HTML fai:

<input type="file" name="Att_AttributeID" onchange="fileSelect(event)" class="inputField" />

Quindi nel tuo file js crea una semplice funzione:

function fileSelect(id, e){
    console.log(e.target.files[0].name);
}

Se stai facendo più file, dovresti anche essere in grado di ottenere l'elenco eseguendo il loop su questo:

e.target.files[0].name



Che ne dici di questo?

var pathArray = $('input[type=file]').val().split('\\');
alert(pathArray[pathArray.length - 1]);



Prendi il primo file dal controllo e poi ottieni il nome del file, ignorerà il percorso del file su Chrome e provvederà anche alla correzione del percorso per i browser IE. Al salvataggio del file, devi usare il metodo System.io.Path.GetFileName per ottenere il nome del file solo per i browser IE

var fileUpload    = $("#ContentPlaceHolder1_FileUpload_mediaFile").get(0); 
var files         =  fileUpload.files; 
var mediafilename = ""; 

for (var i = 0; i < files.length; i++) { 
  mediafilename = files[i].name; 
} 



<script type="text/javascript">

    $('#upload').on('change',function(){
       // output raw value of file input
       $('#filename').html($(this).val().replace(/.*(\/|\\)/, '')); 

        // or, manipulate it further with regex etc.
        var filename = $(this).val().replace(/.*(\/|\\)/, '');
        // .. do your magic

        $('#filename').html(filename);
    });
</script>



Related