Detectando la entrada IME antes de ingresar presionado en Javascript

Question

Ni siquiera estoy seguro de si esto es posible, así que le pido disculpas si es una pregunta estúpida.

He configurado una devolución de llamada keyup a través de jQuery para ejecutar una función cuando un usuario escribe en un cuadro de entrada. Funciona bien para inglés.

Sin embargo, al ingresar texto en japonés/coreano/chino, la función no se llama hasta que el usuario confirma su texto.

¿Es posible detectar que han empezado a escribir y acceder a su texto aún no terminado?

Estoy pensando que quizás sea una cosa de nivel de sistema operativo, por lo que JavaScript no tiene acceso a ella.

Editar: Me acabo de dar cuenta de que esto funciona en Chrome y Safari, pero no en Firefox (aún no se ha podido probar en Windows). Así que Chrome llama a la función de teclado y es posible obtener el texto. Pero sigo teniendo el problema anterior en Firefox.

Answer 1

Ésta es una known issue en Firefox, y lo que los navegadores debería estar haciendo isn't clear.

Un posible método para evitar este problema es demonstrated here, donde se sondea el campo de texto para realizar cambios en el texto (en lugar de confiar en los eventos).

Answer 2

Los compositionstart, compositionupdate y compositionend eventos podrían ser útiles. Lo ayudan a detectar cuándo se está utilizando la entrada IME.

Por ejemplo, considere usar un IME para escribir か (ka) en japonés.
Los siguientes eventos (en el orden mostrado) sería despedido:

• k (IME visible) keydown, compositionstart, compositionupdate, compositionend, entrada
• un (IME visible), compositionstart, compositionupdate, composit ionend, entrada
• introduzca (IME cerrado) keydown, entrada

Observe que los eventos Compositon solamente se encienden cuando el IME es visible (antes de se pulsa ENTER). También observe que el evento keypress no se activa. Esto solo se activa para la entrada que no es IME.

Para acceder al texto inacabado del usuario, puede usar la propiedad data del evento.

$('#input').on('compositionupdate', function(e) { 
    console.log(e.data); 
}); 

Para más información ver MDN: compositionstart, compositionupdate, compositionend, InputEvent.