php ajax图片上传,利用ajax+php实现文件上传

理论上来说此类的文件/图片上传插件已经很多了，但是在使用的过程中还是会遇到各种各样的问题，，兼容问题、后台问题~~等等，所以既然别人的轮子我用不好，那就自己动手造一个吧。

本文中使用jq.ajax和php实现上传功能，前端代码一般无差，有的小伙伴后台不是php的，请参考贵语言的文档进行操作即可。

先看一下效果图，整个上传界面大概是这样的：查看demo

整体思路：

1、创建input设置type=file，id=file，样式设置opacity:0，position:absolute

2、创建一个遮罩层，并设置position:absolute并且z-index大于file

3、创建FormData对象，把file放到FormData中做为数据

4、创建ajax，发送FormData数据到upload.php，监听ajax的progress事件，实时返回上传进度

5、在html页面输出服务器的响应

6、上传完成之后，点击“继续上传”按钮，打开文件选择框，可继续上传。

HTML部分，比较简单：

选择文件

上传

继续上传

未选择文件

CSS，样式可以根据个人喜好自由调整，这里仅供参考：*{

font-family