现代浏览器才支持的拖曳功能（HTML5技术）

最近频频看到一些网站，开始支持拖曳的功能。就是可以直接将本地电脑里面的文件拖曳到网页中，然后直接上传。这功能确实给我们的文件上传带来了极大的方便。那么网页中这个功能是怎么做到的呢？这个就是HTML5的魅力，它属于HTML5标准的一项新功能。

随着HTML5新功能不断登场，越来越多开发者、设计师也跃跃欲试。如果您也想体验这个功能可以打开下面提及的网址测试一下。目前国内著名的邮件服务提供商163已经在其邮件平台增加了这项功能，可以轻松的拖曳需要上传附件。

不过在体验这项功能之前，需要你的浏览器支持HTML5。根据最近公布的11月份浏览器市场份额的数据看来，国内还有很多用户在使用IE6，这部分用户自然是无法体验到这项功能了。您可以将浏览器升级到IE9，或者使用FireFox、Chrome、Opera等浏览器。

这是 Mozilla Hacks 制作的范例（针对FireFox 3.6）

http://demos.hacks.mozilla.org/openweb/DnD/

这个网页可以读取影片、文字档桉、图片档桉等等，并且显示出来。打开该网页以后，将内容拖曳到以下这个区域内即可读取出来。

这个功能是如何实现的呢？

因为并没有深入研究，因此仅只能将理解的原理告诉大家哈！经过观看范例后，大致上了解到下列几点。

使用JavaScript辅助，在HTML5新增的addEvent方法协助DOM操作。简单来说，在HTML5的JavaScript又多了许多新功能。我想最备受瞩目之一的就是WebSocket了！

而addEvent()这个方法可以监听一些事件。其中drop相关事件也可以监听。只要用 JavaScript 捕捉要被“拖曳文件放入的区域”，接着用addEvent新增事件监听。

现在将文件拖曳到这个区块，就能触发事件了。其后的处理就真的不清楚了！当然这个也不是我们要说的重点，有点走题了。

在听到该功能是采用HTML5技术现实的时候，激动的同时还有点莫名的失落，毕竟还有不肯升级IE的用户和一些旧版浏览器得照顾。

相信HTML5会推出越来越多的新功能，这些新功能必将滋生越来越多样化的网络应用，使我们获得更快捷、方便的网络体验。如果你也想成为这些新技术的获益者，那么久快升级您的浏览器吧。因为这些功能都需要一个现代浏览器的支持。如果大家都能普及到新版浏览器，必定会有更多开发人员乐意采用这些技术的。我们的网络生活也更美好了。