加入收藏 | 设为首页 | 会员中心 | 我要投稿 李大同 (https://www.lidatong.com.cn/)- 科技、建站、经验、云计算、5G、大数据,站长网!
当前位置: 首页 > 站长学院 > PHP教程 > 正文

PHP Ajax实现无刷新附件上传

发布时间:2020-12-12 21:40:57 所属栏目:PHP教程 来源:网络整理
导读:对一个网站而言,有一个基本的不可缺少的功能,那就是文件上传。使用PHP预压来实现文件上传可谓是有得天独厚的优势的,那么今天,就一起来做一个关于无刷新实现的文件上传吧。 ---------------------------------------------------------------------------

对一个网站而言,有一个基本的不可缺少的功能,那就是文件上传。使用PHP预压来实现文件上传可谓是有得天独厚的优势的,那么今天,就一起来做一个关于无刷新实现的文件上传吧。

--------------------------------------------------------------------------------

普通表单

前端页面

Username

Password

E-mail

后台处理

// 在服务器上和数据库内容信息对比即可,实现相关的业务逻辑。

···

带有文件的表单

带有文件的表单和普通表单是有很大的区别的,首先我们要在表单上声明一个属性,如下:

来告诉服务器,我们上传的表单包含有文件信息。

刷新方式

谈到刷新模式,也就是点击完submit之后,页面跳转到业务处理界面。这也是我们普通方式实现的表单的数据提交。

前端界面

Username

Password

E-mail

Photo

后台页面

后台处理除了普通的表单数据之外,最重要的是处理文件信息。PHP内置了一个函数,可以方便的把上传过来的文件从临时的数据区转移到我们的目标文件夹,实现上传的业务逻辑。

move_uploaded_file('临时文件路径','目标文件路径');

无刷新方式

使用无刷新方式,与使用刷新方式的唯一的区别就是阻止了页面的跳转,我们通常会有两种方式来实现。 •在表单提交事件的末尾加上return false。

var form = document.getElementsByTagName('form')[0]; form.onsubmit = function(){ // to do something ··· // 阻止页面跳转 return false; }

•使用h5相关方式。

var form = document.getElementsByTagName('form')[0]; form.onsubmit = function(event){ // to do something ··· // 阻止页面跳转 event.preventDefault(); }

其他的操作处理与带跳转的保持一致即可。

大文件上传

虽然PHP实现其文件上传很方便,也很快速。但是上传文件的大小并不是无限制的。默认来说,有两个因素会限制我们上传文件的大小。 •post的极值 •upload的极值 我们可以通过手动的更改php.ini配置信息来实现上传文件大小的控制。

POST极值

post_max_size = 200M

upload极值

upload_max_filesize=200M

上传细节

ajax对象有一个叫upload的属性,而且upload也作为一个对象而存在。其拥有一个叫onprogress的方法,我们可以通过监测这个方法,来查看文件上传过程中的百分比。

前端页面

文件上传示例

无刷新方式上传附件

Username

Password

E-mail

Photo

后台处理

"; //print_r($_FILES);

// 附件的存储位置、附件的名字,记得一定要存在upload文件夹
$path = "../upload/";

// 获取文件的原始名称
$origin_name = $_FILES['photo']['name'];
// 拼接成该文件在服务器上的名称
$server_name = $path.$origin_name;

if($_FILES['photo']['error']>0) {
die("出错了!".$_FILES['photo']['error']);
}
if(move_uploaded_file($_FILES['photo']['tmp_name'],$server_name)){
echo "
"."Upload Success!";
}else{
echo "
"."Upload Failed!".$_FILES['photo']['error'];
}
?>

记得保证upload文件夹的存在性以及路径问题。

总结

文件上传是一个很基础的功能,实现起来也不是很复杂。但是这个功能却又是那么的重要,我们可以方便的通过文件上传来配合修改用户的诸如头像,以及其他文件信息。

以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持编程之家。

(编辑:李大同)

【声明】本站内容均来自网络,其相关言论仅代表作者个人观点,不代表本站立场。若无意侵犯到您的权利,请及时与联系站长删除相关内容!

    推荐文章
      热点阅读