来以贴［第30讲］HTML5 + PHP 拖拽文件上传

毕业设计作品自己个人还是觉得比较满意的，尽管有些功能考虑的不全面，也没有很好的实现。

视频解压暗码请到论坛取得：

http://bbs.php100.com/read-htm-tid-386208-ds-1.html

①Drag&Drop拖拽功效的处置

②FileAPI扫瞄器猎取文件
③FormData摹拟表单完成Ajax文件上传

Drag&Drop:HTML5基于拖拽的事务机制.
FileAPI:能够很便利的让Web使用会见文件工具，FileAPI包含FileList、Blob、File、FileReader、URIscheme，本文次要解说拖拽上传顶用到的FileList和FileReader接口。
FormData:FormData是基于XMLHttpRequestLevel2的新接口，能够便利web使用摹拟Form表双数据，最主要的是它撑持文件的二进制流数据，如许我们就可以够经由过程它来完成AJAX向后端发送文件数据了。

过往我们想完成网页中的拖拽效果，基础上都是利用DOM事务模子中的mousedown、mousemove、mouseup的事务监听来摹拟拖拽效果，为了完成及时的拖拽挪动效果，还要一直地猎取鼠标的坐标，还要一直的修正元素的地位，代码要堆良多，并且功能上也很欠好(一直地修正元素地位会招致页面reflow，除非相对定位)，如今有了html5原生的Drag&Drop拖拽事务，真的是便利了很多，用”事半功倍”来描述毫不为过。

Drag&Drop包含以下事务：
dragstart：要被拖拽的元素入手下手拖拽时触发，这个事务工具是被拖拽元素
dragenter：拖拽元素进进方针元素时触发，这个事务工具是方针元素
dragover：拖拽某元素在方针元素上挪动时触发，这个事务工具是方针元素
dragleave：拖拽某元素分开方针元素时触发，这个事务工具是方针元素
dragend：在drop以后触发，就是拖拽终了时触发，这个事务工具是被拖拽元素
drop：将被拖拽元素放在方针元素内时触发，这个事务工具是方针元素

完成一次乐成页面元素拖拽的举动事务历程：dragstart–>dragenter–>dragover–>drop–>dragend


//要想完成拖拽，首页必要制止扫瞄器默许举动，一共四个事务。
$(document).on({
dragleave:function(e){//拖离
e.preventDefault();
$(.dashboard_target_box).removeClass(over);
},
drop:function(e){//拖后放
e.preventDefault();
},
dragenter:function(e){//拖进
e.preventDefault();
$(.dashboard_target_box).addClass(over);
},
dragover:function(e){//拖来拖往
e.preventDefault();
$(.dashboard_target_box).addClass(over);
}
});

登录/注册后可看大图

登录/注册后可看大图

登录/注册后可看大图

                                                       
                不可能吃饭的时候咬了自己一下舌头就从此不吃饭了不是?放下畏惧，继续努力，咱们是来征服它的，而不是被它征服的，振奋起来吧同志。

对于初学者来说不推荐去拿钱买的。当然如果一个网站你经常去用，而且里面的资料也比较有用，最好还是买个会员比较好，毕竟那些也是别人的工作成果。

多看优秀程序员编写的代码，仔细理解他们解决问题的方法，对自身有很大的帮助。

说php的话，首先得提一下数组，开始的时候我是最烦数组的，总是被弄的晕头转向，不过后来呢，我觉得数组里php里最强大的存储方法，所以建议新手们要学好数组。

写js我最烦的就是 ie 和 firefox下同样的代码 结果显示的结果千差万别，还是就是最好不要用遨游去调试，因为有时候遨游是禁用js的，有可能代码是争取结果被遨游折腾的认为是代码写错。

如果你可以写完像留言板这样的程序，那么你可以去一些别人的代码了，

对于懒惰的朋友，我推荐php的集成环境xampp或者是wamp。这两个软件安装方便，使用简单。但是我还是强烈建议自己动手搭建开发环境。

有时候汉字的空格也能导致页面出错，所以在写代码的时候，要输入空格最好用引文模式。

本人接触php时间不长，算是phper中的小菜鸟一只吧。由于刚开始学的时候没有名师指，碰过不少疙瘩，呗很多小问题卡过很久，白白浪费不少宝贵的时间，在次分享一些子的学习的心得。