微博图片上传html,类似新浪微博和google图片的HTML5实现图片拖拽上传功能

来源：

http://www.lovesunlife.com/?p=315 这篇文章对google图片为蓝本就拖拽上传功能分析得可谓一个详细。在此收录一下

dragenter事件：当文件被拖进改元素中时触发

dragover事件：类似于mouseover事件，只是拖拽经过的时候触发

drop事件：拖拽释放的时候触发，及拖拽图片并放下图片时触发(不知道是否易懂)

主要有这么几个交互点，交互功能可以参考google图片搜索：

1).图片被拖入当前网页时，显示拖拽提示层，此时通过document的dragover或dragenter触发

2).图片拖拽进来后拖拽出去后，隐藏拖拽提示层，没有该事件，自己在做这个项目中参考了google的实现技巧，是通过mouseover事件来控制提示层的隐藏的

3).拖拽释放时(drop事件)，获取图片数据，进行格式的判断，并上传图片

e.stopPropagation();

e.preventDefault();//阻止默认行为，避免图片在浏览器中打开(默认行为)

if (e.dataTransfer.files.length) {//如果是从外部拖拽则length不等于0，如果直接从网络中拖拽则该值为0

try {

me.handlerFiles(e.dataTransfer.files);

} catch(c) {

return;

}

}