如何在javascript dragenter事件期间判断拖动的内容是文本还是文件

Mar*_*ool 4 javascript drag-and-drop file-upload dom-events

使用dragenter事件我在网页上显示一个dropzone,以便快速上传文件,这一切都运行良好.但是,拖动所选文本时,也会弹出dropzone.如何在早期分辨出差异?

  1. 我知道drop事件使用dataTransfer.files公开要迭代的所有文件内容,但为时已晚.我需要它在dragenter,只有我看到文件数组始终是空的.

  2. 我需要完全控制外观和感觉我不是在寻找现有的lib.

  3. 在拖动文本与文件时,我可以看到event.dataTransfer.Clipboard.effectAllowed的不同值,但每个浏览器的值也不同(Chrome与FF).

  4. 如果有帮助,MooTools就位.

Mar*_*ool 10

好的,我已经取得了足够的进展,可以在Chrome和Firefox(3.6+)中实现差异化.这可能不是万无一失,但万一有人可能会发现它有用,这里是代码:

  var isFileTransfer = false;
  if (evt.dataTransfer.types) {
    for (var i=0; i<evt.dataTransfer.types.length; i++) {
      if (evt.dataTransfer.types[i] == "Files") {
        isFileTransfer = true;
        break;
      }
    }
  }
Run Code Online (Sandbox Code Playgroud)