2009-10-30 4 views

Répondre

26

Vous ne pouvez pas changer le caractère de masquage de mot de passe dans le champ de mot de passe standard. Vous pouvez simuler avec une zone de texte, mais cela en fait un modèle de sécurité faible, car vous n'obtenez pas la protection que vous avez dans la zone de texte du mot de passe. En règle générale, ce n'est généralement pas une bonne idée de changer le comportement d'éléments comme celui-ci car les utilisateurs se sont habitués à une forme de masquage, et vous en introduisez un autre - s'il n'y a pas de bonne raison de le faire, d l'éviter.

+0

Comment puis-je faux avec zone de texte, mais je ne suis pas d'utiliser cette fonction pour le mot de passe, s'il vous plaît vérifier http://stackoverflow.com/questions la question/31604402/replace-text-with-stars-in-html-without-javascript? Noredirect = 1 # comment51159417_31604402 –

3

Non - l'agent utilisateur choisit son propre style par défaut, et il est (à ma connaissance) ne CSS vous pouvez modifier les attributs pour déterminer le caractère de masquage.

Bien sûr, cela serait possible si le champ de mot de passe était un champ de texte standard, et vous masqué manuellement l'entrée avec un gestionnaire d'événements javascript (onKeyPress, probablement). Vous pouvez même déclarer le champ type="password" dans le code HTML, puis que votre fonction JS modifie le DOM pour changer son type. Je serais un peu méfiant de faire cela, cependant; La mise en œuvre du navigateur est presque certainement assez solide, et contournant la fonctionnalité de sécurité établie pour rouler la vôtre est rarement une bonne idée.

+6

Fonctionnalités de sécurité établies? Les champs de saisie de mot de passe et de texte en HTML sont à peu près les mêmes, seulement l'interface utilisateur change, le masquage se produisant dans les champs de mot de passe. Je ne réduis pas votre réponse, mais ce n'est pas comme réinventer la roue ou créer un moteur de cryptographie homebrew, mais juste patcher un élément de l'interface utilisateur pour répondre à vos goûts. – Spidey

+1

@Spidey, outre le masquage de caractères, les champs de mot de passe empêchent également de copier le contenu de ceux-ci, en fonction du navigateur et du système d'exploitation. –

+1

@MicahHenning Merci de l'avoir signalé. Quoi qu'il en soit, même si l'utilisateur a essayé de copier à partir de la zone de texte personnalisée, tout ce qu'il obtiendrait serait astérisques ou points ou tout autre symbole que vous choisissez pour masquer le mot de passe réel. – Spidey

1

A partir de maintenant, il semble que cela est possible dans les navigateurs WebKit. S'il vous plaît voir http://help.dottoro.com/lcbkewgt.php pour des exemples et de la documentation.

Ne s'applique pas à l'entrée de mot de passe

<input type="text" style="-webkit-text-security: square;" />

Il n'y a pas une bonne solution pour les autres navigateurs que quand cette réponse a été écrit et même dans les navigateurs WebKit, les caractères sont autorisés à spécifier sont très limités.

+4

Cela ne fonctionne pas. Je l'ai testé sur 4 navigateurs différents. –

+0

Mis à jour. Merci @OleHaugset. – www139

14

Créez votre propre police et utilisez @font-face et font-family (et font-size) pour input[type="password"]. Cela devrait aider à résoudre votre problème. Mais ... vous devez créer une police avec une puce et un astérisque remplacés. Tous les numéros de caractères dans la police peuvent représenter le même caractère. Utilisez google pour trouver un programme gratuit pour éditer les polices vectorielles.

Ne dites jamais "il est impossible". Vous devriez trouver un hack pour votre problème. Caractères à remplacer par votre symbole (Chrome, Firefox et MSIE): 26AB, 25E6, 25CF, 25D8, ​​25D9, 2219, 20F0, 2022, 2024, 00B7, 002A.

(18C)

+1

Avez-vous un exemple de police à partager? – camolin3

+0

cela devrait être la réponse parfaite ... Merci l'homme ... a résolu mon problème –

+1

@waLLe: Femme pas homme ... Les gens pensent rarement le comportement abstrait et à plusieurs niveaux. BTW. la question est ancienne (2009) mais toujours active. Dans le passé, '@ font-face' n'était pas défini. En 2009 ce n'était pas possible mais ... les gens répètent la réponse malgré le fait que Firefox la supporte depuis la v3.5, IE probablement depuis la v6, Chrome depuis la v4. Mais quand même ... Opera Mini ne supporte pas. Quand j'ai écrit ma réponse, la réponse principale a +21 points. – 18C

0

<input type="text" style="-webkit-text-security: circle;" />

+1

La propriété CSS '-webkit-text-security' ne fonctionnera pas sur IE, Firefox ou Opera. – sorak