637 votes

Définir la valeur d'un champ de saisie

Comment définir la valeur par défaut d'un formulaire ? <input> champ de texte en JavaScript ?

1133voto

jayp Points 2383

C'est une façon de le faire :

document.getElementById("nameofid").value = "My value";

7 votes

Je le ferai, mais existe-t-il un moyen de rendre la valeur NULL si l'utilisateur clique sur le champ ?

4 votes

Oui, attribuez un gestionnaire d'événement au champ de saisie qui efface la valeur en cas de clic. Exemple : elem.onclick = clearField() ; // cela renverrait à une fonction qui efface le champ en mettant la valeur à zéro, comme dans la réponse ci-dessus.

1 votes

Pour moi, cela n'a pas fonctionné. Est-ce que la méthode ci-dessus crée l'attribut de valeur ?

87voto

Pepe Amoedo Points 19

J'utilise la fonction 'setAttribute' :

<input type="text" id="example"> // Setup text field 
<script type="text/javascript"> 
  document.getElementById("example").setAttribute('value','My default value');
</script>

37 votes

value doivent être accédés directement en utilisant la notation par points : developer.mozilla.org/fr/US/docs/Web/API/Element.setAttribute vous utilisez uniquement set/getAttribute pour traiter la valeur originale. Après le chargement du DOM, .value représente la valeur réelle de travail de l'élément.

6 votes

@ChrisBaker Je voudrais +1000 cette réponse si je pouvais. J'ai une application tierce qui scanne les champs de saisie pour automatiser l'application (ma page est rendue dans un contrôle ie intégré). Il s'agit d'un scénario unique où les champs de saisie sont consommés par l'application du client. Les champs de saisie n'ont pas été réinitialisés immédiatement après le postback en utilisant .value dans ma fonction document ready. Lorsque l'utilisateur lance un postback asynchrone, il réutilise ces valeurs d'entrée pour automatiser quelque chose sur lequel il a cliqué auparavant et j'ai besoin que la page les "oublie". C'est la sauce magique dont j'avais besoin. Merci Pepe et Chris !

4 votes

J'utilise Yii 2.0 et le fait de définir directement .value = '' ne permet pas d'exécuter correctement la validation du formulaire sur le champ. L'utilisation de setAttribute('value','...') est correctement gérée. merci !

64voto

Varada Points 1856

Si votre formulaire contient un champ de saisie comme

<input type='text' id='id1' />

alors vous pouvez écrire le code en javascript comme indiqué ci-dessous pour définir sa valeur comme suit

document.getElementById('id1').value='text to be displayed' ;

0 votes

AIDE ! Je le fais mais la valeur revient toujours à l'original dès que je clique sur un autre champ ou sur un bouton de la page. Voici le site web que je fais (avec class"_56AraZ") shopee.vn/buyer/login?next=https%3A%2F%2Fshopee.vn%2F Quelqu'un peut-il me montrer comment définir réellement la valeur pour automatiser la connexion dans ce site web.

20voto

dallinchase Points 79

Essayez ceux-là.

document.getElementById("current").value = 12

// or

var current = document.getElementById("current");
current.value = 12

2 votes

Ne définissez jamais de valeurs non textuelles pour ces champs. Si vous relisez, vous lirez "string" ( !) dans certains navigateurs).

0 votes

AIDE ! Je le fais mais la valeur revient toujours à l'original dès que je clique sur un autre champ ou sur un bouton de la page. Voici le site web que je fais (avec class"_56AraZ") shopee.vn/buyer/login?next=https%3A%2F%2Fshopee.vn%2F Quelqu'un peut-il me montrer comment définir réellement la valeur pour automatiser la connexion dans ce site web.

8voto

Jdoonan Points 68

La réponse est simple : en Javascript, le moyen le plus simple d'obtenir le caractère de remplacement est l'attribut du caractère de remplacement.

<input type="text" name="text_box_1" placeholder="My Default Value" />

1 votes

Le problème est que cela ne fonctionne pas du tout avec Internet Explorer. Si vous savez que vous n'aurez pas de clients IE, alors oui, c'est la meilleure solution.

2 votes

@Sifu C'est probablement une bonne chose à faire même si tu hacer sachez que vous avez des clients IE (éventuellement en plus d'une solution JavaScript), car il redéfinira également la valeur lorsque le champ sera vidé.

1 votes

@Sifu quand est-ce qu'IE ne supporte pas l'attribut placeholder, utilisez IE et allez sur www.1c3br3ak3r-multimedia.ca et regardez la barre de recherche, elle utilise l'attribut placeholder.

Prograide.com

Prograide est une communauté de développeurs qui cherche à élargir la connaissance de la programmation au-delà de l'anglais.
Pour cela nous avons les plus grands doutes résolus en français et vous pouvez aussi poser vos propres questions ou résoudre celles des autres.

Powered by:

X