Entrada HTML5, detección en tiempo real y optimización de retrasos

Hay un proyecto donde el cuadro de entrada monitorea la entrada en tiempo real y activa la solicitud.

La primera idea es utilizar el método onchange() en la entrada. Lo probé, pero no funciona. Sólo se activará después de que se confirme el cambio de valor, lo cual no es inmediato.

Lo revisé en línea,

 $(#fix).on('cambio de propiedad de entrada', función(evento){});

El método funciona, pero cambia en tiempo real. La frecuencia de envío es un poco rápida.

Date prisa y agrega un temporizador setTimeout.

 $(#fix).on('input propertychange', function(event){ setTimeout(function(){ //Retraso de 0,5 s para ejecutar console.log($(#fix).val()) },500); } );

El problema vuelve a aparecer. El temporizador es asíncrono, aunque está retrasado, se ejecutará sin ningún cambio.

Más tarde, pensé en desvincular y vincular, pero no se pudieron obtener eventos de entrada del teclado durante el tiempo de desvinculación.

La primera idea en ese momento era activar el evento - eliminar el temporizador - agregar el temporizador - ejecutar la función. Descubrí que todavía no estaba bien y que el temporizador no se podía eliminar, así que simplemente dejé de ejecutarlo.

Finalmente, revisé en línea y encontré un nuevo método.

Método de marca de tiempo.

El principio es que cada vez que la entrada modifica la variable global y la marca de tiempo, la nueva marca de tiempo se monitoreará con un retraso de 0,5 segundos y será igual a la marca de tiempo vinculada, y luego continuará con el siguiente paso.

-----html-----

 <tipo de entrada=id de texto=fix>------script-----var last;$(#fix).on('input propertychange', function(event){ //#fix es tu input Box last = event.timeStamp; //Utilice la marca de tiempo del evento para marcar el tiempo, de modo que cada evento modifique el valor del último. Tenga en cuenta que último debe ser una variable global setTimeout(function(){ //Establezca un retraso de tiempo de 0,5. s para ejecutar if(last -event.timeStamp==0) //Si la diferencia horaria es 0 (es decir, no se produce ningún otro evento de pulsación de tecla dentro de los 0,5 s después de dejar de escribir), haga lo que quiera { console.log($(#fix).val()) } } , 500);});

Lo anterior es la optimización de retardo y detección en tiempo real de entrada HTML5 que le presentó el editor. Espero que le resulte útil. Si tiene alguna pregunta, déjeme un mensaje y el editor le responderá a tiempo. ¡También me gustaría agradecer a todos por su apoyo al sitio web de artes marciales VeVb!