Comment renommer le bouton HTML "Parcourir" d'un input de type fichier ?

Question

Comment renommer le bouton de navigation en "Sélectionner le fichier"? Par exemple:

Answer 1

function HandleBrowseClick()
{
    var fileinput = document.getElementById("browse");
    fileinput.click();
}
function Handlechange()
{
var fileinput = document.getElementById("browse");
var textinput = document.getElementById("filename");
textinput.value = fileinput.value;
}

http://jsfiddle.net/J8ekg/

Answer 2

Le bouton n'est pas appelé le "bouton de navigation" - c'est juste le nom que votre navigateur lui donne. Les navigateurs sont libres d'implémenter le contrôle de téléchargement de fichiers comme ils le souhaitent. Dans Safari, par exemple, il est appelé "Choisir un fichier" et il est situé de l'autre côté de ce que vous utilisez probablement.

Vous pouvez personnaliser l'apparence du contrôle de téléchargement en utilisant la technique décrite sur QuirksMode, mais cela va au-delà de simplement changer le texte du bouton.

Answer 3

Un peu de JavaScript s'en chargera :

function HandleBrowseClick()
{
    var fileinput = document.getElementById("browse");
    fileinput.click();
    var textinput = document.getElementById("filename");
    textinput.value = fileinput.value;
}

Ce n'est peut-être pas la solution la plus esthétique, mais ça marche.

Answer 4

Le champ d'entrée de type "file" est très délicat car il se comporte différemment sur chaque navigateur, il ne peut pas être stylisé, ou peut être stylisé un peu, en fonction du navigateur encore une fois; et il est difficile à redimensionner (en fonction du navigateur encore une fois, il peut avoir une taille minimale qui ne peut pas être modifiée).

Il existe cependant des solutions de contournement. Le meilleur, à mon avis, est celui-ci (le résultat est ici).

Answer 5

Non, vous ne pouvez pas changer le texte de l'entrée de téléchargement de fichier. Mais il existe quelques astuces pour superposer une image sur le bouton.