Pregunta

Tengo una situación donde necesito para interceptar cada eso es clave que se prensan en un div a contentEditable. Pero cuando el evento de pulsación de tecla que pase, si lo hago,

document.getElementById("divEditor").innerHTML

No puedo obtener el texto completo (no tiene el último carácter pulsado)

Además, keyup caso no se dispara por las pulsaciones de teclas continuas. ¿Qué puedo hacer para tener un evento clave que tiene el valor total?

¿Fue útil?

Solución

keyup es el único evento que llega a ver el estado posterior a la pulsación de tecla.

Uno de los enfoques es atrapar keydown y establecer un tiempo de espera para hacer algo de procesamiento después de la pulsación de tecla:

input.onkeydown= function() {
    setTimeout(function() {
        // do something
    }, 1);
};

Sin embargo, si también es posible hacer modificaciones sin pulsación de una tecla (y por lo general es, a través de arrastrar y soltar y elementos de menú como cortar y pegar), ninguna cantidad de la comprobación de los eventos clave le ayudará. En su lugar, simplemente se debe sondear el estado para ver si ha cambiado. Puede respaldar esto con un controlador de tiempo de espera o onkeyup onkeydown para hacer esa actualización caso particular sea más rápida.

var oldstate= input.value;
function checkState() {
    if (input.value!=oldstate) {
        // do something
        oldstate= input.value;
    }
}
setInterval(checkState, 1000);
input.onkeyup= checkState;

(Este utiliza un elemento de entrada para simplificar, pero es igualmente aplicable a contentEditable.)

Otros consejos

¿qué pasa con onblur()? usted necesitaría dos funciones, su función de pulsación de tecla, y luego una onBlur () de llamada cuando el enfoque ha dejado el cuadro de texto. Esto debería dar acceso al resto del texto.

Parece que la mejor manera sería tener un campo de entrada (position:absolute; left:-1000px) y añadir los 3 eventos (keydown keypress keyup) a la misma.

Ahora se puede utilizar el valor de este campo de entrada, obras CTRL + Z y se puede pegar valores.

Todo lo que tiene que hacer que es setFocus al campo de entrada.

var user_action = function ()
{
   document.getElementById("divEditor").innerHTML =    document.getElementById("myhiddenInput").value;
};

document.getElementById("myhiddenInput").onchange = user_action;
document.getElementById("myhiddenInput").onkeydown  = user_action;
document.getElementById("myhiddenInput").onkeyup    = user_action;
document.getElementById("myhiddenInput").onkeypress = user_action;

document.getElementById("divEditor").onclick = document.getElementById("myhiddenInput").focus;
Licenciado bajo: CC-BY-SA con atribución
No afiliado a StackOverflow
scroll top