son ejemplos editable content change javascript jquery html html5 contenteditable

javascript - ejemplos - en html, onblur y onfocus son:



Detectar un evento de pegar en un contenteditable (1)

dado un contenido editable div. ¿Cómo puedo detectar un evento de pegado, evitar que se inserte el pegado, así que puedo interceptar y sanear el pegado para incluir solo texto?

Tampoco quiero perder el foco después de que se complete el proceso de paste + sanitize.


ACTUALIZAR:

Todos los navegadores principales ahora le dan acceso a los datos del portapapeles en un evento de pegado. Consulte la respuesta de Nico Burns para ver un ejemplo de un navegador más nuevo y también revise la respuesta de Tim Down si necesita admitir navegadores más antiguos.

Puede escuchar el evento onPaste en el div para detectar el pegado. Si solo desea deshabilitar el pegado, puede llamar a event.preventDefault() desde ese oyente.

Sin embargo, capturar el contenido pegado es un poco más difícil ya que el evento onPaste no le da acceso al contenido pegado. La forma habitual de manejar esto es hacer lo siguiente desde el controlador de eventos onPaste :

  • cree un dummy div y colóquelo fuera de los límites de la ventana para que no sea visible para los visitantes
  • mueve el foco a esta div
  • llamar a un método desinfectante usando un setTimeout(sanitize, 0)

y de su método de desinfección:

  • encontrar el div simulado y obtener su contenido
  • Desinfecte el HTML y elimine el div
  • mueve el foco de nuevo a la div original
  • Inserte el contenido desinfectado en el div original.