Se pueden cambiar los * de un input pasword

chalchis · #1 (**permalink**) 26/03/2005, 12:21

Hola amigos tengo curiosidad por saber si puedo cambar los
* de un input password por otros caracteres

por ejemplo vean este ejemplo y introduzcan algo en el campo
pasword

https://ns5.server-spain.com:8443/login.php3

JavierB · #2 (**permalink**) 26/03/2005, 12:40

Hola chalchis

Respuesta rápida: no

Saludos,

Holden · #3 (**permalink**) 26/03/2005, 12:42

la url no anda....
No se pueden cambiar, pero si se puede simular aunque es un gran lio...
No creo que valga la pena.

Igual quisiera ver el ejemplo.

chalchis · #4 (**permalink**) 26/03/2005, 12:48

COPIA la url en tu navegador
no la ejecutes desde el foro quiensabe por que razon no
se abre desde el foro.

saludos

Danger_ · #5 (**permalink**) 26/03/2005, 14:41

eso se logra con algun API, SEGUN YO !! :) jejeje...

haber checa esta sample, http://www.blueshoes.org/en/javascript/checkbox/, la verdad esque nunca probe nada de esa web, pero debe funcionar :), ya que te dan la posibilidad de bajar todos sus demos.

espero te sirva, saludos !

Holden · #6 (**permalink**) 29/03/2005, 06:26

Danger_ eso que pasteaste, son imagenes. estan emulando los checkbox con imagenes ;)

KarlanKas · #7 (**permalink**) 29/03/2005, 10:10

Jugando un poco con estilos y javascript...

Código PHP:

  <html> 
<head> 
    <title>Untitled</title> 
    <script> 
    caracter="-"//Pon el caracter que quieras que salga en vez de los asteriscos 
    function simil(e,esto){ 
    var key=(document.all) ? e.keyCode : e.wich; 
    varia=(key==8)?0:1; 
    palabra=esto['pepe'].value; 
palabro=""; 
 
    for(a=0;a<palabra.length+varia;a++){ 
     
    palabro+=caracter; 
    } 
    esto['popo'].value=palabro 
     
    } 
     
    </script> 
</head> 
 
<body> 
<form> 
<input style="position:absolute;top:10px;left:10px;font:normal 10px/10px courier;"type="text" name="pepe" onkeypress="simil(event,this.form)"> 
<input style="position:absolute;top:10px;left:10px;font:normal 10px/10px courier;" type="text" name="popo" onfocus="this.form['pepe'].focus()"> 
<input style="position:absolute;top:40px;left:10px;" type="button" onclick="alert(this.form.pepe.value)" value="ver valor"> 
</form> 
</body> 
</html>

Ahora que seguridad ninguna, eh?

Holden · #8 (**permalink**) 29/03/2005, 11:55

Bueno ese es el ejemplo de emulación que hablaba...
el punto es que el ingreso lo haces en el imput llamado popo
pero cuando proceses la password debes usar el imput pepe.
Salu2.

chalchis · #9 (**permalink**) 29/03/2005, 12:08

Pues no se si sea seguro o no, pues solo se introduce
algo en un input, no se que opinen???

KarlanKas · #10 (**permalink**) 29/03/2005, 13:19

No creo que sea el ejemplo del que hablabas, Holden... lo acabo de hacer yo solito.

La próxima vez pon el ejemplo del que hablas y me ahorro el devanarme los sesos pensando el código.

Digo que no es seguro porque cualquiera puede ver el contenido del input.

adex · #11 (**permalink**) 29/03/2005, 16:08

Gracias KarlanKas a mi me sirvio tu ejemplo....

KarlanKas · #12 (**permalink**) 29/03/2005, 16:26

Me alegro de que te fuera bien, adex!

chalchis · #13 (**permalink**) 29/03/2005, 17:40

Gracias Karlankas

KarlanKas · #14 (**permalink**) 30/03/2005, 01:41

De nada

Holden · #15 (**permalink**) 01/04/2005, 13:34

Nah karlankas, no te lo tomes tan a pecho...
Lo que decia es que ese "es un modelo de codigo de emulación" no fue mi intención decir "eso es el mismisimo codigo de emulación" ni mucho menos opacar tu desarrollo.

Mis post era mas que nada para que tenga el detalle de a que campo pedirle el valor. nada mas.

Salu2

derkenuke · #16 (**permalink**) 01/04/2005, 18:59

el link inicial en opera y en firefox representa *, en IE cuadraditos.

KarlanKas · #17 (**permalink**) 02/04/2005, 08:38

No te preocupes, Holden. No me lo tomé a pecho. Pero no entendí ni entiendo lo que quieres decir... se ve que estoy lento de entendederas.

chalchis · #18 (**permalink**) 02/04/2005, 12:37

Antes que nada gracias a los que han contestado
hola derkenuke tienes razon en el ejemplo que puse no funcionan
en firefox y mozilla.

Pero el ejemplo que mando karlankas si funciona solo tiene un detalle
en ie quiero borra lo que escribi pero no meja y en firefox al momento de borra
con la tecla retroceso siempre deja un caracter.

Estoy checando como se podria evitar esos detalles y a ver si karlankas podria ayudarnos.

gracias amigos

esperos sus comenatios

JavierB · #19 (**permalink**) 02/04/2005, 12:50

Con su permino, Maestro KarlanKas

He cambiado onkeypress por onkeyup y he "pasao" del uso de la variable varia (menos mal que no la has llamado pepe, sino cualquiera la toca

)

Código PHP:

  <html> 
<head> 
    <title>Untitled</title> 
    <script> 
    caracter="-"//Pon el caracter que quieras que salga en vez de los asteriscos 
    function simil(e,esto){ 
    var key=(document.all) ? e.keyCode : e.wich; 
    palabra=esto['pepe'].value; 
    palabro=""; 
 
    for(a=0;a<palabra.length;a++){ 
     
    palabro+=caracter; 
    } 
    esto['popo'].value=palabro 
     
    } 
     
    </script> 
</head> 
 
<body> 
<form> 
<input style="position:absolute;top:10px;left:10px;font:normal 10px/10px courier;"type="text" name="pepe" onkeyup="simil(event,this.form)"> 
<input style="position:absolute;top:10px;left:10px;font:normal 10px/10px courier;" type="text" name="popo" onfocus="this.form['pepe'].focus()"> 
<input style="position:absolute;top:40px;left:10px;" type="button" onclick="alert(this.form.pepe.value)" value="ver valor"> 
</form> 
</body> 
</html>

Saludos,

derkenuke · #20 (**permalink**) 03/04/2005, 06:05

A ve si puedo aportar algo

Esto se supone que es para sustituir todos los caracteres de palabra por caracter y guardarlo en palabro no?

Código PHP:

      palabra=esto['pepe'].value;  
    palabro="";  
    for(a=0;a<palabra.length;a++){  
         palabro+=caracter;  
    }

Pues hagamoslo:

Código PHP:

  palabro=palabra.replace(/./g,caracter);

Nah, solo para reducir el codigo, no se si se hara mas legible porque metemos expresiones regulares (mira q es sencilla) pero.. a mi si me lo parece

KarlanKas · #21 (**permalink**) 03/04/2005, 06:21

No veais como me alegra que os animeis a mejorar mi chapucero código.

La razón de que no empleara el onkeyup, Javier, creo que era (porque no me acuerdo) para evitar el problema que se producia si se dejaba la tecla pulsada. Mientras que en la caja oculta salían tropecientos caracteres en la caja visible sólo mostraba una. Y también lo hice por un tema del borrar caracteres (creo). Pero si has logrado resolverlo (sin quitar la variable pepe), JavierB, perfecto!

Y tu contribución es muy buena, derkenuke. Ya sabe JavierB que mi obsesión es reducir el código lo más posible.

Un saludo!

KarlanKas · #22 (**permalink**) 03/04/2005, 06:28

He hecho pruebas con tu código, JavierB, y creo que el problema de borrar con backspace no se resuelve. Es decir. Con mi código se ve cuando se borra un caracter, sin embargo en el tuyo no... Respecto a corregir el borrar con la tecla delete no se me ocurre como hacerlo, porque no logro que la capture... aunque si tras borrar escribes se corrige.

Y con keypress derkenuke tu código no queda bien... pone un espacio al principio. Alguna sugerencia para aunar tanto código?

... Pasado un tiempecito...

Creo que he logrado evitar el feo efecto del espacio al principio con keypress en la mejora de derkenuke! Lo he logrado añadiendo:

Código HTML:

palabro=(key==8)?'':caracter;

Código PHP:

  <html> 
<head> 
    <title>Untitled</title> 
    <script> 
     
    caracter="-"//Pon el caracter que quieras que salga en vez de los asteriscos 
    function simil(e,esto){ 
        var key=e.keyCode; 
        palabra=esto['pepe'].value; 
        palabro=(key==8)?'':caracter; 
        palabro+=palabra.replace(/./g,caracter); 
        esto['popo'].value=palabro 
    } 
     
    </script> 
</head> 
 
<body> 
<form> 
<input style="position:absolute;top:10px;left:10px;font:normal 10px/10px courier;"type="text" name="pepe" onkeypress="simil(event,this.form)"> 
<input style="position:absolute;top:10px;left:10px;font:normal 10px/10px courier;" type="text" name="popo" onfocus="this.form['pepe'].focus()"> 
<input style="position:absolute;top:40px;left:10px;" type="button" onclick="alert(this.form.pepe.value)" value="ver valor"> 
</form> 
</body> 
</html>

Sin embargo esta mejora sólo funcionará con IE. En Firefox sigue dejando un caracter a la derecha al borrar...

JavierB · #23 (**permalink**) 03/04/2005, 07:54

He vuelto a probar "mi" código y me parece que funciona bien en IE 6 y Firefox 1.0.2 Se puede borrar con backspace y con suprimir y se ve en el cuadro como se elimina un guión. También funciona con la modificación de derkenuke, muy buena por cierto.

Saludos,

KarlanKas · #24 (**permalink**) 03/04/2005, 08:53

No sé que estaré haciendo mal pero si escribo algo en el código que propones, al borrar deja las rayas... igual hago algo mal... el código que pongo es:

Código PHP:

  <html> 
<head> 
    <title>Untitled</title> 
    <script> 
    caracter="-"//Pon el caracter que quieras que salga en vez de los asteriscos 
    function simil(esto){ 
    esto['popo'].value=esto['pepe'].value.replace(/./g,caracter);  
    } 
     
    </script> 
</head> 
 
<body> 
<form> 
<input style="position:absolute;top:10px;left:10px;font:normal 10px/10px courier;"type="text" name="pepe" onkeyup="simil(this.form)"> 
<input style="position:absolute;top:10px;left:10px;font:normal 10px/10px courier;" type="text" name="popo" onfocus="this.form['pepe'].focus()"> 
<input style="position:absolute;top:40px;left:10px;" type="button" onclick="alert(this.form.pepe.value)" value="ver valor"> 
</form> 
</body> 
</html>

He quitado la variable key porque con la variación propuesta no se utiliza... ¿qué hago mal?

KarlanKas · #25 (**permalink**) 03/04/2005, 08:55

Andá! Ya sé lo que hago mal. Lo estaba viendo en la vista previa del Homesite 5.5. Si lo veo en una ventana normal del navegador se ve bien.

Retiro lo dicho!! Muy buena mejora, sí señor!

PD.- Con las dos mejoras podemos reducir el código una barbaridad!

Código PHP:

  <script> 
    caracter="-"//Pon el caracter que quieras que salga en vez de los asteriscos 
    function simil(esto){ 
    esto['popo'].value=esto['pepe'].value.replace(/./g,caracter); 
    } 
     
    </script>

derkenuke · #26 (**permalink**) 03/04/2005, 18:03

Vale solo si teneis ganas de retos (y os aburris un poco), hacer que se pueda pinchando en la caja de texto borrar el caracter del centro por ejemplo.

Es decir, cuando haces click el foco te lleva a la caja de rayitas, pero no puedes moverte con el raton por la caja, solo con las flechas, ese es el unico problema que le veo.

Por lo demas, todo perfecto!