web-dev-qa-db-fra.com

Comment définir une largeur d'entrée pour correspondre à la largeur du texte de l'espace réservé

Exemple http://dabblet.com/Gist/5859946

Si vous avez un espace réservé long, l'entrée par défaut ne s'affiche pas assez large pour afficher tout le texte de l'espace réservé.

par exemple.

<input placeholder="Please enter your name, address and shoe size">

Sans définir une largeur fixe, et de préférence pas de javascript, pouvez-vous définir l'entrée pour afficher tout le texte de l'espace réservé?

35
Dan Eastwell

Cela ne peut être fait que via javascript en définissant la taille = longueur de l'espace réservé:

input.setAttribute('size',input.getAttribute('placeholder').length);

Voici un code qui dose cela pour toutes les entrées: http://jsfiddle.net/KU5kN/

29
Avner Solomon

Juste au cas où quelqu'un voudrait l'utiliser avec jQuery, ce code serait ci-dessous. De plus, si l'attribut placeholder n'existe pas dans la réponse acceptée, vous obtiendrez des erreurs, ce qui est également pris en charge dans l'exemple jQuery ci-dessous.

$("input[placeholder]").each(function () {
        $(this).attr('size', $(this).attr('placeholder').length);
    });
6
Brian Leishman