Javascript - Comment extraire un nom de fichier d'un contrôle d'entrée de fichier

Question

Lorsqu'un utilisateur sélectionne un fichier dans une page Web, je veux pouvoir extraire uniquement le nom du fichier.

J'ai bien essayé la fonction str.search mais elle semble échouer lorsque le nom du fichier est quelque chose comme ceci : c :\uploads\ilike.this.file.jpg.

Comment pouvons-nous extraire juste le nom du fichier sans extension ?

Answer 1

Pour diviser la chaîne ({filepath}/{filename}) et obtenir le nom du fichier, vous pouvez utiliser quelque chose comme ceci :

str.split(/(\\|\/)/g).pop()

"La méthode POP supprime le dernier élément d'un tableau et renvoie cette valeur à l'appelant."
Réseau de développeurs Mozilla

Exemple :

à partir de : "/home/user/file.txt".split(/(\\|\/)/g).pop()

vous obtenez : "file.txt"

Answer 2

En supposant que votre <input type="file" > dispose d'un identifiant de téléchargement, cela devrait, espérons-le, faire l'affaire :

var fullPath = document.getElementById('upload').value;
if (fullPath) {
    var startIndex = (fullPath.indexOf('\\') >= 0 ? fullPath.lastIndexOf('\\') : fullPath.lastIndexOf('/'));
    var filename = fullPath.substring(startIndex);
    if (filename.indexOf('\\') === 0 || filename.indexOf('/') === 0) {
        filename = filename.substring(1);
    }
    alert(filename);
}

Answer 3

De nos jours, il existe un moyen beaucoup plus simple :

var fileInput = document.getElementById('upload');   
var filename = fileInput.files[0].name;

Answer 4

Très simple

let file = $("#fileupload")[0].files[0]; 
file.name

Answer 5

En supposant :

<input type="file" name="file1" id="theFile">

Le JavaScript serait :

var fileName = document.getElementById('theFile').files[0].name;