Teclas de captura digitadas en el teclado virtual android con javascript

Por desgracia parece que no se puede hacer mucho aquí. El evento Keypress está obsoleto y, por lo tanto, no se dispara. 229 en keyup y keydown indica que el búfer del teclado está ocupado. La razón – al presionar una tecla – la entrada todavía no está garantizado para ser lo que el usuario presionó, debido a auto sugerir y otros eventos que pueden seguir inmediatamente e invalidar el evento. Aunque en mi opinión habría sido mejor enviar la clave primero, luego disparar otro evento tal vez en auto sugieren para que pueda actuar sobre él por separado …

La única cosa que actualmente conozco es adjuntar a ambos – keydown y keyup, almacenar el valor en keydown, obtener el valor de keyup y encontrar el delta, que es lo que el usuario presionó. Desafortunadamente esto no funcionará para los controles que no son de entrada (por ejemplo, el cuerpo o algo así). Tal vez no lo que quieres escuchar como respuesta, pero todavía.

Me encontré con el mismo problema. Hay varias explicaciones, pero de todos modos parece extraño que no se ofrezca ninguna solución. Por el momento lo solucioné capturando el evento oninput .

"Este evento es similar al evento onchange.La diferencia es que el evento oninput se produce inmediatamente después de que el valor de un elemento ha cambiado, mientras que onchange ocurre cuando el elemento pierde el foco, después de que el contenido ha sido cambiado"

Este evento también incluye texto insertado, de pegar texto o de correcciones y sugerencias.

No me da la solución perfecta porque sólo puedo manipular el texto DESPUÉS de haber sido ingresado, pero por el momento es lo mejor que tengo.

Si alguien tiene una mejor solución, me alegrará saberlo.

Basta con comprobar los caracteres de entrada keyCode, si es 0 o 229 entonces aquí es la función getKeyCode () que utiliza charCodeAt de JS para devolver el KeyCode que toma la cadena de entrada de un parámetro y devuelve keycode de último carácter.

 <script> var getKeyCode = function (str) { return str.charCodeAt(str.length); } $('#myTextfield').on('keyup',function(e){ //for android chrome keycode fix if (navigator.userAgent.match(/Android/i)) { var inputValue = this.value; var charKeyCode = e.keyCode || e.which; if (charKeyCode == 0 || charKeyCode == 229) { charKeyCode = getKeyCode(inputValue); alert(charKeyCode+' key Pressed'); }else{ alert(charKeyCode+' key Pressed'); } } }); </script> 

Me encontré con esta discusión mientras hacía la investigación para un proyecto que estaba trabajando. Tuve que crear máscaras de entrada para una aplicación móvil, y la respuesta de Pavel Donchev me hizo pensar en lo que podría funcionar para capturar claves en Android. En mi proyecto específico, keydown y keyup no sería suficiente porque el evento keyup solo se activa después de que se lance una clave, por lo que implicaría una validación tardía, así que hice más investigación (y mucho ensayo y error) con eventos de entrada Y lo consiguió trabajando.

 var input = document.getElementById('credit-card-mask'), oldValue, newValue, difference = function(value1, value2) { var output = []; for(i = 0; i < value2.length; i++) { if(value1[i] !== value2[i]) { output.push(value2[i]); } } return output.join(""); }, keyDownHandler = function(e) { oldValue = input.value; document.getElementById("onkeydown-result").innerHTML = input.value; }, inputHandler = function(e) { newValue = input.value; document.getElementById("oninput-result").innerHTML = input.value; document.getElementById("typedvalue-result").innerHTML = difference(oldValue, newValue); } ; input.addEventListener('keydown', keyDownHandler); input.addEventListener('input', inputHandler); 

 <input type="text" id="credit-card-mask" /> <div id="result"> <h4>on keydown value</h4> <div id="onkeydown-result"></div> <h4>on input value</h4> <div id="oninput-result"></div> <h4>typed value</h4> <div id="typedvalue-result"></div> </div> 

¡ME LO IMAGINÉ!

Esta es una solución de trabajo 100% que funciona EN TODO LUGAR con CADA característica, incluyendo sugerencias de emoji incluso en iOS y cualquier contenido pegado. Estoy utilizando la comparación de subcadenas para encontrar cosas reales que cambiaron de onInput a onInput.

El código está formateado con pestañas de 4 espaciados. Extremadamente fácil de entender .. Bueno, lo más fácil posible, al menos. Se señalan los puntos desde los cuales se elimina el texto y de que al que se ha insertado.

Clasificación y selección como una respuesta es apreciada.

 var x = document.getElementById("area") , text = x.value , event_count = 0 function find_Entered_And_Removed_Substrings ( previous_string , current_string , pos ) { let right_pos = pos , right_boundary_of_removed = previous_string.length - ( current_string.length - pos ) , left_max_pos = Math.min( pos , right_boundary_of_removed ) , left_pos = left_max_pos for ( let x = 0 ; x < left_max_pos ; x ++ ) { if ( previous_string [ x ] !== current_string [ x ] ) { left_pos = x break } } return { left : left_pos , right : pos , removed_left : left_pos , removed_right : right_boundary_of_removed } } x.oninput = (e)=> { // debugger; let cur_text = x.value , positions = find_Entered_And_Removed_Substrings ( text , cur_text , Math.max( x.selectionStart , x.selectionEnd ) ) console.log ( positions ) let entered = cur_text.substring ( positions.left , positions.right ) , removed = text.substring ( positions.removed_left , positions.removed_right ) if ( entered.length > 0 || removed.length > 0 ) { document.getElementById( "entered" ) .innerHTML += entered document.getElementById( "removed" ) .innerHTML += removed document.getElementById( "events" ) .innerHTML = event_count++ } text = cur_text } 

  <textarea id="area"></textarea> <br/> <pre id= "entered" ></pre> <br/> <div id= "events" > </div> <pre id= "removed" > </pre>