¿Cómo configuro un detector en jQuery/javascript para monitorear un si un valor en el cuadro de texto ha cambiado?

Question

¿Cómo configuro un detector en jQuery/javascript para monitorear a si ha cambiado un valor en el cuadro de texto? El valor se introduce en el cuadro de texto mediante un escáner de código de barras conectado a la tableta, de modo que cada vez que se escanea un elemento, el valor en el cuadro de texto cambia. Necesito mostrar información basada en el valor en el cuadro de texto.

Answer 1

¿Qué tal:

$('#textbox').change(function() 
{ 
    alert($(this).val()); 
}); 

Answer 2

Depende de cómo el escáner introduce el valor, y lo que hace el software del escáner después de introducir el valor.

Si el escáner desvía la atención del textarea después de introducir el valor, que puede hacer:

$('yourTextarea').bind('change', function() { 
    alert("Changed to " + $(this).val()); 
}); 

Si no se necesita fuera de foco, que tendrá que vigilar las pulsaciones de teclas, y después reaccionan un período de inactividad.

$('yourTextarea').bind('keypress', function() { 
    var self = $(this); 

    clearTimeout(self.data('timeout')); 

    self.data('timeout', setTimeout(function() { 
     alert("Changed to " + $(this).val()); 
    }, 500)); 
}); 

También cabe la posibilidad de que el escáner podría simular un evento paste en el área de texto, así;

$('yourTextarea').bind('paste', function() { 
    var self = $(this); 

    setTimeout(function() { 
     alert("Changed to " + self.val()); 
    }, 1); 
}); 

Usted será capaz de experimentar con su escáner para ver qué método se utiliza (o poner en práctica todos ellos si usted es perezoso).

---

Nota que este post fue escrito en mayo de 2010, cuando la última versión de jQuery 1.6.1 era; desde entonces, bind() ha sido reemplazado a favor de on(). Si está utilizando una versión de jQuery> 1.7, cambie todas las ocurrencias de bind a on en el código anterior.

Answer 3

La realidad es que el evento de 'cambio' en jQuery no siempre es viable en todos los navegadores, algunos de los más antiguos no tratan el evento adecuadamente. He tenido este problema en una serie de proyectos y, por lo general, lo que debe suceder es vincular algunas propiedades de un área de texto para capturar la interacción del usuario. Si se trata de un área de entrada del tipo de texto, puede ser más simple, pero por lo general deberá cubrir sus bases con algunos oyentes de eventos.

Me gustaría echar un vistazo a cómo algunas personas que están haciendo los contadores de caracteres escriben su código para escuchar a los valores de un área de texto y luego también establecer su código de

tratar de cubrir sus bases y tal vez intentar algo como esto :

$('#textareatextID').bind('keyup click blur focus change paste', function() { 
    alert($(this).val()); 
}); 

Esto también evita que forma la necesidad de configurar temporizadores, y como yo no conozco el método que el escáner de código de barras se utilizan para cambiar el valor del área de texto que mi recomendación es bastante amplio.