【生意多】-免费发布分类信息
当前位置: 首页 » 新闻 » 教程 » 正文

HTML5与Ajax强强联手 演绎文件上传

放大字体  缩小字体 发布日期:2020-06-14 09:20:00    浏览次数:19
导读

  【IT168技术】在上一讲《玩转HTML5应用实战:灵活拖拉文件》文章中,我们学习了如何利用HTML5将文件拖拉到浏览器中,并读取出被拖拉文件的类型和其他文件相关信息。在本文中,将介绍如何利用Ajax及HTML5异步将文件上传到服务端。  这里,我们为表单的提交设置为upload.php,用来处理上传的文件,在表单中并且规定了上

  【IT168技术】在上一讲《玩转HTML5应用实战:灵活拖拉文件》文章中,我们学习了如何利用HTML5将文件拖拉到浏览器中,并读取出被拖拉文件的类型和其他文件相关信息。在本文中,将介绍如何利用Ajax及HTML5异步将文件上传到服务端。

  这里,我们为表单的提交设置为upload.php,用来处理上传的文件,在表单中并且规定了上传的图片的大小不超过300K。

  在上个教程中,已经对ParseFile(f)进行了介绍,现在着重看下UploadFile这个方法的代码,代码如下:

  在上面的代码中,使用了目前只有在FireFox和Chrome中才支持的XmlHttpRequest2对象,XmlHttpRequest2是对原先大家熟悉的xmlhttprequest的加强,目前还没最后定案,可以参考的描述。在上面的代码中,首先是判断了上传文件的类型是否为图片文件以及大小是否符合要求,如果符合要求的话,则调用send方法发送文件到服务端,并且这里设置了HTTP文件头X_FILENAME为上传的文件名。

  如果$fn中设置了值,则调用使用file_put_contents方法,将文件复制到uploads文件夹,而如果是通过普通表单的上传,则作如下判断:

 
关键词: html5帮助文档
(文/小编)
打赏
免责声明
• 
本文为小编原创作品,作者: 小编。欢迎转载,转载请注明原文出处:http://www.31duo.com/news/show-269304.html 。本文仅代表作者个人观点,本站未对其内容进行核实,请读者仅做参考,如若文中涉及有违公德、触犯法律的内容,一经发现,立即删除,作者需自行承担相应责任。涉及到版权或其他问题,请及时联系我们。
 

(c)2016-2019 31DUO.COM All Rights Reserved浙ICP备19001410号-4

浙ICP备19001410号-4