Focus sur champ créé via innerHTML
rudak
Messages postés
590
Date d'inscription
Statut
Membre
Dernière intervention
-
rudak Messages postés 590 Date d'inscription Statut Membre Dernière intervention -
rudak Messages postés 590 Date d'inscription Statut Membre Dernière intervention -
Bonjour,
je suis en train de faire un formulaire tout simple avec 2 champs input
pseudo et mot de passe
par défaut on a un texte dans chaque champs ("votre pseudo" et "mot de passse")
j'ai mis un onClick=verif(this) sur chaque champs pour enlever ce texte par défaut
pour le champ pseudo ca va nikel mais sur le champ password c'est plus compliqué en ce qui concerne le type de champs (password / text)
donc j'ai utilisé une petite feinte qui conciste a remplacer carément l'input via innerHTML et qui remplacera l'input type=text par un input type=password
le soucis c'est que je n'arrive pas a avoir un focus sur mon nouveau champ fraichement créé et je ne voi pas d'ou ca peut venir...
voila mon code html :
voila mon javascript :
je suis en train de faire un formulaire tout simple avec 2 champs input
pseudo et mot de passe
par défaut on a un texte dans chaque champs ("votre pseudo" et "mot de passse")
j'ai mis un onClick=verif(this) sur chaque champs pour enlever ce texte par défaut
pour le champ pseudo ca va nikel mais sur le champ password c'est plus compliqué en ce qui concerne le type de champs (password / text)
donc j'ai utilisé une petite feinte qui conciste a remplacer carément l'input via innerHTML et qui remplacera l'input type=text par un input type=password
le soucis c'est que je n'arrive pas a avoir un focus sur mon nouveau champ fraichement créé et je ne voi pas d'ou ca peut venir...
voila mon code html :
<form action="?action=loggin" method="post" enctype="multipart/form-data" name="loggin" target="_self"> <input id="bouton_loggin" type="image" src="../imgs/icones_boutons/bout_ok_glossy.png"> <input id="pseudo_log" name="pseudo_log" value="Votre pseudo" onClick="verif(this)"><br> <div id="div_bouton_password"> <input id="passe_log" value="Mot de passe" onClick="verif(this)"> </div> </form>
voila mon javascript :
function verif(valeur)
{
if(valeur.value == "Votre pseudo")
{
document.getElementById('pseudo_log').value = "";
}
if(valeur.value == "Mot de passe")
{
if(valeur.id == "passe_log")
{
nouveau_champ = "<input id='passe_log' name='passe_log' type='password' value=''>";
document.getElementById("div_bouton_password").innerHTML = nouveau_champ;
document.getElementById('passe_log').focus();
}
}
}
A voir également:
- Focus sur champ créé via innerHTML
- Cree un compte google - Guide
- Comment créer un groupe sur whatsapp - Guide
- Cree gmail - Guide
- Créer un compte instagram sur google - Guide
- Helicon focus - Télécharger - Photo & Graphisme
3 réponses
nan mais ca marche pas sous IE donc ca va pas j'ai déja essayé.
(sinon j'aurais pas fait tout un cinéma avec le innerHTML) =)
(sinon j'aurais pas fait tout un cinéma avec le innerHTML) =)
Tiens une solution en beaucoup plus simple:
<script type="text/javascript">
function verif(id,val_defaut)
{
var valeur= document.getElementById(id).value;
if(valeur == val_defaut)
{
document.getElementById(id).value = "";
}
}
</script>
<form action="?action=loggin" method="post"name="loggin" target="_self">
<input id="pseudo_log" name="pseudo_log" value="Votre pseudo" onFocus="verif('pseudo_log','Votre pseudo')" /><br />
<input id="passe_log" name="passe_log" value="Mot de passe" onFocus="verif('passe_log','Mot de passe')" /> <br /><br />
<input id="bouton_loggin" type="image" src="../imgs/icones_boutons/bout_ok_glossy.png" />
</form>
n'oublies pas le type="..." dans tes input
essayes comme ça:
chez moi sur Firefox ça marche
essayes comme ça:
chez moi sur Firefox ça marche
<script type="text/javascript">
function verif(id,val_defaut)
{
var valeur= document.getElementById(id).value;
if(valeur == val_defaut)
{
document.getElementById(id).value = "";
if(val_defaut=='Mot de passe'){
document.getElementById(id).type='password';
}
}
}
</script>
<form action="?action=loggin" method="post" name="loggin" target="_self">
<input type="text" id="pseudo_log" name="pseudo_log" value="Votre pseudo" onFocus="verif('pseudo_log','Votre pseudo')" /><br />
<input type="text" id="passe_log" name="passe_log" value="Mot de passe" onFocus="verif('passe_log','Mot de passe')" /> <br /><br />
<input type="image" id="bouton_loggin" name="bouton_login" src="../imgs/icones_boutons/bout_ok_glossy.png" />
</form>