为啥这段代码获取不到 files 信息呢？

[kmvan]

JS:

var h5 = {
cache : {},
init : function(){
cache.$file = document.getElementById('file');
cache.$file.addEventListener('drop', this.drop_handle, false);
},
drop_handle : function(e){
e.stopPropagation();
e.preventDefault();
var files = e.target.files || e.dataTransfer.files;
console.info(files);
return false;
}
}
h5.init();

HTML:

<input type="file" name="" id="file" style="font-size:5em">

在 ff 或 chrome 中，把文件拖放进去到 file 按钮，console.log 出来的是空文件信息，这段代码有哪里有错吗？怎么看也没有错吧……

[Arrowing]

<input type="file" name="" id="file" style="font-size:5em" draggable="true">

this.cache.$file = document.getElementById('file');
this.cache.$file.addEventListener('drop', this.drop_handle, false);

[typcn]

http://blog.eqoe.cn/posts/jquery-drag-upload-image.html

参考这个，绑定个事件什么元素都可以了

[Arrowing]

var files = (e.target.files.length && e.target.files) || e.dataTransfer.files;

[kmvan]

@Arrowing var files = (e.target.files.length && e.target.files) || e.dataTransfer.files;

谢谢回复，不过奇怪啊，ff 里面获取的 e.target.files.length 居然是 0，但console出来的明明是显示1。而且 ff 的 e 里面没有 dataTransfer 属性，得加一个 originalEvent.dataTransfer，真奇葩。。。


@typcn 参考这个，绑定个事件什么元素都可以了

3Q，已参考 originalEvent.dataTransfer 这个属性……