0
211
Views¿Cómo obtener el tipo de elemento arrastrado (archivo o texto) cuando se activa el evento de arrastre?
Tengo un área de texto que detecta si un elemento (por ejemplo, un archivo de imagen) se arrastra sobre él.
// drag and drop for upload $('body').on('dragover', 'textarea', function(e) { e.preventDefault(); e.stopPropagation(); // indicator for user $('.drophere').show(); });El problema es que el indicador para soltar también aparece cuando se arrastra texto sobre el área de texto (y no sobre un archivo).
Pensé que podría comprobar el tipo de elemento arrastrado.
HTML_Drag_and_Drop_API dice:
Los datos de arrastre contienen dos piezas de información, el tipo (o formato) de los datos y el valor de los datos. El formato es una cadena de tipo (como texto/sin formato para datos de texto) y el valor es una cadena de texto.
Sin embargo, usando console.log( e.originalEvent.dataTransfer ); en el código anterior no revela ningún tipo de datos.
Los types de atributo siempre están vacíos para el texto arrastrado, pero también para un archivo de imagen arrastrado.
¿Dónde puedo encontrar el tipo de archivo o el tipo de texto sin formato?
1 answers
Answer question0
no puede ver el tipo o los elementos almacenados en el objeto dataTransfer ya que cuando se detiene el arrastre, javascript cambia los valores de este objeto y debido a que se hace referencia a los objetos en javascript, ve el valor cambiado después de soltar el texto. si nota que cuando imprime datos en la consola tienen valores pero al expandir objetos están vacíos.
para que pueda verificar el formato en tiempo de ejecución, pero para la depuración puede usar otros métodos para almacenar este objeto como un objeto de clonación sin referencia. como eso :
var types = $.extend(true, {}, e.originalEvent.dataTransfer.types) var item = $.extend(true, {}, e.originalEvent.dataTransfer.items[0]) console.log(types) console.log(item) 