Detectar un evento de pegar en un contenteditable

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

Tampoco quiero perder el enfoque después de que se haya completado la operación de pegar + desinfectar.

ACTUALIZAR:

Todos los principales navegadores ahora le dan acceso a los datos del portapapeles en un evento de pegado. Vea la respuesta de Nico Burns para ver un ejemplo en el navegador más nuevo y también consulte 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 :

  • crea un div falso y colócalo fuera de los límites de la ventana para que no sea visible para los visitantes
  • mover el foco a este div
  • llamar a un método desinfectante usando setTimeout(sanitize, 0)

y de su método de desinfección:

  • encuentra el dummy div y obtén su contenido
  • desinfectar el HTML y eliminar el div
  • mover el foco de vuelta al div original
  • inserte el contenido desinfectado en el div original