llamar - funcion click en javascript

El evento onclick no se activó cuando onchange se activó justo antes

Question

Tengo un problema gracioso aquí.

Tengo un área de texto con un evento onchange vinculado a él. Luego tengo un botón vinculado a un evento onclick.

El texto que se coloca en el área de texto se procesa cuando el evento onchange se activa en el área de texto. Esto normalmente sucede cuando hago clic en algo fuera del área de texto.

Lo que hice fue lo siguiente:

1. Escribí un texto en el área de texto.
2. Inmediatamente después de tipear, hago clic en el botón para activar el evento onclick en el botón
3. No sucede nada, pero el evento onchange en el área de texto se activó cuando hice clic en el botón, pero el evento onclick en el botón no se activó.

¿Por qué? Esperaba obtener tanto onchange como onclick activados. ¿Hay algo que deba hacer para que el clic en el botón no se "pierda"? Me di cuenta de que tengo que hacer clic dos veces, porque el primer clic provoca el cambio en el área de texto, y ENTONCES, el segundo clic activa el clic en el botón.

El siguiente código muestra un ejemplo, simplemente prueba el siguiente código. Escriba un texto, luego haga clic directamente en ese botón. Solo aparecerá la ventana emergente "textarea".

<textarea onchange="processText();" name="mytext"></textarea>
<button onclick="processButton();">Hello</button>
<script language="Javascript">
function processText()
{
alert( ''textarea'');
}
function processButton()
{
alert( ''button'');
}
</script>

Answer 1

manejar el evento onblur en textarea y el evento onclick en el botón

Answer 2

intente esto para agregar el detector de eventos a los componentes

document.getElementsByTagName("textarea")[0].addEventListener("change", function(){
alert( ''textarea'');
});
document.getElementsByTagName("button")[0].addEventListener("click", function(){
alert( ''button'');
});

si los Ids están definidos, entonces use getElementById () .

Answer 3

Necesitas volver a verificar tus suposiciones. En su ejemplo, alert () interrumpe el flujo del programa, rompiendo el manejo de onclick . Este código ( jsfiddle aquí ) demuestra que onchange no interfiere con onclick por defecto:

<textarea onchange="processText();" name="mytext"></textarea>
<button onclick="processButton();">Hello</button>
<div id="clicked"></div>
<div id="changed"></div>
<script language="Javascript">
function processText()
{
document.getElementById(''changed'').innerHTML = "onchange fired";;
}
function processButton()
{
document.getElementById(''clicked'').innerHTML = "onclick fired";
}
</script>​

Tuve un problema similar, pero la razón real por la que no se manejó el evento onclick fue porque se hizo clic en el elemento, se desplazó hacia abajo como resultado del controlador onchange . Cuando se soltó el botón del mouse, el elemento no recibió un evento de mouse y se interrumpió el "clic".