Texto de arrastrar y soltar sobre DIV

Tengo un div en mi sitio web, y cuando se hace clic en él, se muestra el cuadro de búsqueda (hecho con jQuery).Texto de arrastrar y soltar sobre DIV

Sin embargo, me gustaría que este div aceptara texto arrastrado. En mi caso de uso, un usuario selecciona texto regular de cualquier parte del sitio y lo arrastra para copiarlo y pegarlo en el cuadro de búsqueda.

Si el cuadro de búsqueda siempre estaba visible, simplemente podía soltarlo en el cuadro de texto, manejado de forma nativa por el navegador/sistema operativo. Sin embargo, ¿hay alguna manera de simular lo mismo con este div? El usuario soltaría su texto en el div, y dispararía el evento click para mostrar el cuadro de texto y pegar el texto caído en el cuadro.

Mi sitio web utiliza Modernizr + jQuery + jQuery UI y HTML5/CSS3. La compatibilidad con IE6 no es un problema.

¡Gracias de antemano!

Fuente

2011-09-24 Emphram Stavanger

[Esta pregunta] (http://stackoverflow.com/questions/1922559/jquery-drag-drop-into-a-text-area) cubre un tema similar. –

Vi ese tema, pero requiere que el texto arrastrado esté en un contenedor específico que luego se hace arrastrable(), mientras que estoy hablando de cualquier texto normal antiguo que resalte y arrastre. Ya traté de aplicar droppable() al div, y el evento drop no parece dispararse. –

Quizás usar una combinación de 'mouseover',' mouseup' y 'document.getSelection' funcionaría. Ver http://stackoverflow.com/questions/1317727/get-selected-text-on-the-page-not-in-a-textarea-with-jquery –

Puede utilizar el Drag HTML5 y eventos Drop:

$('#dropTextHere').bind('drop', function (e) { 
    var theDroppedText = e.originalEvent.dataTransfer.getData('Text'); 
});

Puede leer mas sobre esto here.

Fuente

2011-09-24 17:29:14 Cokegod

¡Muchas gracias! ¡Ese código y el artículo lo hicieron! –

Texto de arrastrar y soltar sobre DIV

Respuesta

Cuestiones relacionadas