Use jQuery para obtener el nombre de archivo seleccionado de la entrada del archivo sin la ruta

Usé esto:

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

para obtener el nombre del archivo seleccionado, pero devolvió la ruta completa, como en "C: \ fakepath \ filename.doc". La parte de "ruta falsa" estaba realmente allí, no estoy seguro de si se supone que es así, pero esta es la primera vez que trabajo con el nombre de archivo de las cargas de archivos.

¿Cómo puedo obtener el nombre del archivo (filename.doc)?

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

o simplemente podría hacerlo (porque siempre C:\fakepathse agrega por razones de seguridad):

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

Solo necesita hacer el código a continuación. El primer [0] es acceder al elemento HTML y el segundo [0] es acceder al primer archivo de carga del archivo (incluí una validación en caso de que no haya ningún archivo):

    var filename = $('input[type=file]')[0].files.length ? ('input[type=file]')[0].files[0].name : "";

Chrome regresa C:\fakepath\...por razones de seguridad: un sitio web no debería poder obtener información sobre su computadora, como la ruta a un archivo en su computadora.

Para obtener solo la parte del nombre de archivo de una cadena, puede usar split()...

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

jsFiddle .

... o una expresión regular ...

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

jsFiddle .

... o lastIndexOf()...

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

jsFiddle .

Obtenga trabajo de ruta con todos los SO

var filename = $('input[type=file]').val().replace(/.*(\/|\\)/, '');

Ejemplo

C:\fakepath\filename.doc 
/var/fakepath/filename.doc

Ambos regresan

filename.doc
filename.doc

Así es como lo hago, funciona bastante bien.

En tu HTML haz:

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

Luego, en su archivo js, ​​cree una función simple:

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

Si está haciendo varios archivos, también debería poder obtener la lista haciendo un bucle sobre esto:

e.target.files[0].name

tal vez alguna adición para evitar fakepath:

var fileName = $('input[type=file]').val();
var clean=fileName.split('\\').pop(); // clean from C:\fakepath OR C:\fake_path 
alert('clean file name : '+ fileName);

¿Qué tal algo como esto?

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

¿Tiene que ser jquery? ¿O puede usar el nativo de JavaScript yourpath.split("\\")para dividir la cadena en una matriz?

Obtenga el primer archivo del control y luego obtenga el nombre del archivo, ignorará la ruta del archivo en Chrome y también corregirá la ruta para los navegadores IE. Al guardar el archivo, debe usar el System.io.Path.GetFileNamemétodo para obtener el nombre del archivo solo para los navegadores 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>

var filename=location.href.substr(location.href.lastIndexOf("/")+1);
alert(filename);

Esta alternativa parece la más adecuada.

$('input[type="file"]').change(function(e){
        var fileName = e.target.files[0].name;
        alert('The file "' + fileName +  '" has been selected.');
});

Aquí puedes llamar así Deja que este sea mi control de Archivo de entrada

  <input type="file" title="search image" id="file" name="file" onchange="show(this)"  />

Ahora aquí está mi Jquery que se llama una vez que selecciona el archivo

<script type="text/javascript">
    function show(input) {
        var fileName = input.files[0].name;
        alert('The file "' + fileName + '" has been selected.');               
            }

</script>

También podemos eliminarlo usando match

var fileName = $('input:file').val().match(/[^\\/]*$/)[0];
$('#file-name').val(fileName);