Propagación de eventos en JS
Publicado por Sergius (9 intervenciones) el 15/09/2006 20:46:37
Hola, que tal?!? .. necesito urgente una ayudita con esto! .. les cuento:
(me parece que es un tema bastante interesante y que vale la pena resolver entre todos :P )
Validar que el usuario solo pueda teclear ciertas teclas (como van a ver que funciona en el ejemplo en el cual se lo limita a no poder apretar la tecla de "backspace"), pero hay un problemilla!, cual es? .. que en Iexplorer al validar ese evento "onkeypress" luego lo mata y no deja pasar por otro evento que tmb utilice el "onkeypress"
NOTA: Esto no pasa con el Mozilla (Netscape) por q manejan la propagación de eventos de manera inversa!
Aqui les dejo el ejemplo que para que lo copien en un .html y sale andando, pero con el detalle de que: verán que con el IExplorer no entra correctamente a la función "onkeypress" que tiene el input de type=text, en cambio, en el mozilla si.
ALGUNA AYUDAAAAAAAAAA!!!
<!--
Este ejemplo solo anda correctamente en el Mozilla/Netscape, no en IExplorer.
Manejan los eventos de maneras diferentes.
Reproducir que la función validateNumbers(e), quién valida que solo se ingresen números en el input text
solo funciona para Mozilla/Netscape.
-->
<html>
<head>
<script type="text/javascript">
<!--
// BackSpace OFF
backSpaceOff();
function backSpaceOff(){
if (document) {
if (document.onkeydown == null){
//Se tienen en cuenta los eventos onkeydown y onkeypress para q sea compatible con: Netscape/IE
document.onkeydown = backSpaceOffValidate;
document.onkeypress = backSpaceOffValidate;
}else{
var a = document.onkeypress;
}
}
}
function backSpaceOffValidate(event) {
event = event || window.event;
var tgt = event.target || event.srcElement;
var strid = tgt.type;
if (event.keyCode == 8 && tgt.type != "text" && tgt.type != "textarea" && tgt.type != "password"){
alert("Prohibida");
return false;
}else{
alert("Correcta");
return true;
}
}
function validateNumbers(e){
alert ('Tecla pulsadada: ' + e.keyCode);
tecla = (document.all) ? e.keyCode : e.which;
if (tecla==8) return true;
//Patrón que solo permite el ingreso de números
patron = /[\d\,\.]/;
te = String.fromCharCode(tecla);
return patron.test(te);
}
//-->
</script>
</head>
<body>
<form>
<input type="text" onkeypress="return validateNumbers(event);"/>
<input type="submit" value ="Send"/>
</form>
</body>
</html>
(me parece que es un tema bastante interesante y que vale la pena resolver entre todos :P )
Validar que el usuario solo pueda teclear ciertas teclas (como van a ver que funciona en el ejemplo en el cual se lo limita a no poder apretar la tecla de "backspace"), pero hay un problemilla!, cual es? .. que en Iexplorer al validar ese evento "onkeypress" luego lo mata y no deja pasar por otro evento que tmb utilice el "onkeypress"
NOTA: Esto no pasa con el Mozilla (Netscape) por q manejan la propagación de eventos de manera inversa!
Aqui les dejo el ejemplo que para que lo copien en un .html y sale andando, pero con el detalle de que: verán que con el IExplorer no entra correctamente a la función "onkeypress" que tiene el input de type=text, en cambio, en el mozilla si.
ALGUNA AYUDAAAAAAAAAA!!!
<!--
Este ejemplo solo anda correctamente en el Mozilla/Netscape, no en IExplorer.
Manejan los eventos de maneras diferentes.
Reproducir que la función validateNumbers(e), quién valida que solo se ingresen números en el input text
solo funciona para Mozilla/Netscape.
-->
<html>
<head>
<script type="text/javascript">
<!--
// BackSpace OFF
backSpaceOff();
function backSpaceOff(){
if (document) {
if (document.onkeydown == null){
//Se tienen en cuenta los eventos onkeydown y onkeypress para q sea compatible con: Netscape/IE
document.onkeydown = backSpaceOffValidate;
document.onkeypress = backSpaceOffValidate;
}else{
var a = document.onkeypress;
}
}
}
function backSpaceOffValidate(event) {
event = event || window.event;
var tgt = event.target || event.srcElement;
var strid = tgt.type;
if (event.keyCode == 8 && tgt.type != "text" && tgt.type != "textarea" && tgt.type != "password"){
alert("Prohibida");
return false;
}else{
alert("Correcta");
return true;
}
}
function validateNumbers(e){
alert ('Tecla pulsadada: ' + e.keyCode);
tecla = (document.all) ? e.keyCode : e.which;
if (tecla==8) return true;
//Patrón que solo permite el ingreso de números
patron = /[\d\,\.]/;
te = String.fromCharCode(tecla);
return patron.test(te);
}
//-->
</script>
</head>
<body>
<form>
<input type="text" onkeypress="return validateNumbers(event);"/>
<input type="submit" value ="Send"/>
</form>
</body>
</html>
Valora esta pregunta
0