Javascript changer le type d'entrée de façon dynamique ne fonctionne pas sur IE8
j'ai un champ de saisie pour entrer le mot de passe dans une page web:
<input name="txtPassword" type="text" class="input2" id="txtPassword" value="Password" onfocus="txtOnFocus2('txtPassword','Password');" onblur="txtOnBlur2('txtPassword','Password');" />
dans l'état initial, le usershould lire "mot de passe" comme valeur initiale, et quand il commence à taper un mot de passe, le champ doit changer de type de mot de passe. Aussi, lorsqu'il définit il est de retour à vide ou de la valeur initiale du champ doit changer de type "texte" et afficher le mot de passe.
J'ai écrit un code obtenu, il travaille sur Firefox, Chrome et safari et sa ne change pas le type de mot de passe sur IE 8.
c'est le code js que j'ai faite en modification d'un code de fonction:
function txtOnFocus2(elementId, defaultText)
{
if (document.getElementById(elementId).value == defaultText)
{
document.getElementById(elementId).value = "";
document.getElementById(elementId).type = "password";
}
}
function txtOnBlur2(elementId, defaultText)
{
var textValue = document.getElementById(elementId).value;
if (textValue == defaultText || textValue.length == 0)
{
document.getElementById(elementId).type = "text";
document.getElementById(elementId).value = defaultText;
}
}
Cela fonctionne très bien dans Firefox,chrome et safari, mais ne change pas le type de champ sur IE 8.
OriginalL'auteur mithunsatheesh | 2011-10-01
Vous devez vous connecter pour publier un commentaire.
Une autre solution serait de changer votre approche tout à fait. La technique suivante dégrade gracieusement, est plus accessible et moins de JavaScript-personne à charge:
HTML
JavaScript
CSS
Démo Live: http://jsfiddle.net/rjkf4/
"moins de javascript dépendante"?
Oui. Cette technique fonctionne avec ou sans JavaScript. JS, dans ce cas, c'est simplement l'amélioration de la technique en changeant la couleur d'arrière-plan pour rendre l'entrée plus lisible. Dans n'a aucun effet sur le champ de saisie de la fonctionnalité.
donc, ce serait "pas javascript dépendantes". 🙂 Vous pouvez faire certaines de ces choses avec des CSS et des valeurs d'attribut, mais malheureusement, en gardant les propriétés et les attributs de synchronisation est une douleur.
mithunsatheesh vous pouvez changer le $("input"). la partie du code à saisir les différents éléments. E. g. si vous ajoutez des données de masquer le mot de passe="true" attribut spécifique des champs de saisie, vous pouvez ensuite modifier le JavaScript $("[data-cacher-mot de passe]").
OriginalL'auteur Ayman Safadi
J'ai essayé avant. Il n'y a aucun moyen de le faire dans IE. C'est une sécurité de chose. Mais encore, vous pouvez définir la
value
d'unpassword
input
dans IE. De sorte que vous pouvez supprimer letext
input
et de le remplacer par unpassword
input
et puis définissez lavalue
de nouveauxinput
.JSFIDDLE
De travail pour moi ici, quel navigateur êtes-vous essayer?
firefox 6.0.2 ....
OriginalL'auteur Mohsen
Au lieu de:
essayer:
Plus d'infos: http://www.javascriptkit.com/dhtmltutors/domattribute.shtml
De sorte que vous pouvez le faire et de le laisser planter dans IE < 8, ou vous pouvez remplacer l'élément du type que vous voulez et de le faire travailler de plus en plus largement. 🙂
désolé pas de résoudre le problème.. le mot de passe n'est pas toujours de changer le type. le repos est de travailler..
OriginalL'auteur Ayman Safadi
Dans IE 6 et 7 (au moins) vous ne pouvez pas modifier le type d'une entrée qui est déjà dans le document. Vous devez créer une nouvelle entrée, définissez son type, puis remplacer celui qui est dans le document, par exemple
Il fonctionne dans IE 8, je l'ai testé. La propriété, vous devez copier est className, pas de la classe.
désolé.. je vais essayer..
OriginalL'auteur RobG
Quelque chose de laid qui toutefois devrait fonctionner (je n'ai pas IE8 portée de main pour le tester) serait de placer votre terrain dans un div et le remplacement de toute la chose avec
container.innerHTML = "<input ...>"
en cas de besoin.OriginalL'auteur 6502
essayer cette
http://www.electrictoolbox.com/jquery-toggle-between-password-text-field/
OriginalL'auteur Bala
En option vous pouvez simplement faux avoir un texte visible dans le champ mot de passe en utilisant une image de fond avec que du texte.
OriginalL'auteur