Discussion :

[jubourbon]

Bonjour à tous,

je developpe pour la premiere fois un site ou les utilisateurs doivent se loguer.
Pour cela j'ai mis des input

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
 
<input type='text' name='username' class='inputText' id='userName' value='utilisateur' />
<input type='password' name='password' class='inputText' id='password' value='password'/>

Mais j'aimerais que lorsque l'utilisateur clique sur l'input pour saisir ses valeurs, les valeur par defaut disparaissent.

Merci pour votre aide.

[insane1]

Tu pourrais utiliser la propriete OnFocus() de tes input et modifier leur value.

Quelque chose comme ca :

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
<input type='text' name='username' class='inputText' id='userName' value='utilisateur' onfocus="this.value=''"/>
<input type='password' name='password' class='inputText' id='password' value='password'onfocus="this.value=''"/>

[jubourbon]

Je vais essayer, mais le risque n'est il pas que cela efface tous à chaque fois qu'il clique.

Par exemple, j'ecris mon login, je passe au password, je reviens sur le login car j'ai oublié une lettre et faut que je retape tout.

Y a un truc pas mal que j'ai vu sur des sites, mais que je ne sais pas faire, c'est quand je clique sur l'input, ca selectionne tout le texte et du coup j'ecris à la place.

[jubourbon]

J'ai trouvé, avec onfocus="selected"

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
<input type='text' name='username' class='inputText' id='userName' value='utilisateur' onfocus="select()"/>
<input type='password' name='password' class='inputText' id='password' value='password' onfocus="select()"/>

Merci de ton aide.

[insane1]

Oui en effet avec la methode que je t'ai proposée si l'utilisateur revient sur le champ celui ci devra tout retaper.
Dans ce cas il vaut mieux faire une petite fonction js.
Je viens de la coder rapidement elle n'est surement pas parfaite mais elle fonctionne.

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
<script>
 
function efface(id) {
var element = document.getElementById(id);
if (element.value == "utilisateur")
        {
        element.value = "";
        }
else
        {
        element.select();
        }
if (element.value == "password")
        {
        element.value = "";
        }
else
        {
             element.select();
             }
}
 
</script>
 
<input id="user" type='text' name='username' class='inputText' id='userName' value='utilisateur' onfocus='efface(this.id);'/>
<input id="password" type='password' name='password' class='inputText' id='password' value='password'onfocus="efface(this.id);"/>

Edit : J'ai ajouté ta solution en faisant un petit mix

[jubourbon]