前端显示界面： 1 <!DOCTYPE html>
 <html lang="en">
 <head>
   <meta charset="UTF-8">
   <title>上传文件</title>
   <script type="text/javascript">
     function sub() {
       var obj = new XMLHttpRequest();
       obj.onreadystatechange = function() {
         if (obj.status == 200 && obj.readyState == 4) {
           document.getElementById('con').innerHTML = obj.responseText;
         }
       }

       // 通过Ajax对象的upload属性的onprogress事件感知当前文件上传状态
       obj.upload.onprogress = function(evt) {
         // 上传附件大小的百分比
         var per = Math.floor((evt.loaded / evt.total) * 100) + "%";
         // 当上传文件时显示进度条
         document.getElementById('parent').style.display = 'block';
         // 通过上传百分比设置进度条样式的宽度
         document.getElementById('son').style.width = per;
         // 在进度条上显示上传的进度值
         document.getElementById('son').innerHTML = per;
       }

       // 通过FormData收集零散的文件上传信息
       var fm = document.getElementById('userfile3').files[0];
       var fd = new FormData();
       fd.append('userfile', fm);

       obj.open("post", "upload.php");
       obj.send(fd);
     }
   </script>
   <style type="text/css">
     #parent {
       width: 200px;
       height: 20px;
       border: 2px solid gray;
       background: lightgray;
       display: none;
     }
     #son {
       width: 0;
       height: 100%;
       background: lightgreen;
       text-align: center;
     }
   </style>
 </head>
 <body>
   <h2>Ajax实现进度条文件上传</h2>
   <div id="parent">
     <div id="son"></div>
   </div>
   <p id="con"></p>
   <input type="file" name="userfile" id="userfile3"><br><br>
   <input type="button" name="btn" value="文件上传" onclick="sub()">
 </body>
 </html>

后台处理页面：
f ($_FILES['userfile']['error'] > 0) {
                exit("上传文件有错".$_FILES['userfile']['error']);
                echo errors;
        }

        // 定义存放上传文件的真实路径
        $path = './upload/';
        // 定义存放上传文件的真实路径名字
        $name = $_FILES['userfile']['name'];

        // 将文件的名字的字符编码从UTF-8转成GB2312
        $name = iconv("UTF-8", "GB2312", $name);

        // 将上传文件移动到指定目录文件中
        if (move_uploaded_file($_FILES['userfile']['tmp_name'], $path.$name)) {
                echo "文件上传成功";
        } else {
                echo "文件上传失败";
        }
 ?>

性能优化处理-》上传大小限制-》修改中间件Apache下的php.ini文件

   max_execution_time = 1200，Maximum execution time of each script, in seconds 脚本最大执行时间，单位是秒

  max_input_time = 1000 接收传输数据的最长时间，单位也是秒

  memory_limit = 128M 一个脚本占用内存的上限

  post_max_size = 128M post方式传输的数据最大的上限

  file_uploads = On 允许文件上传

  upload_max_filesize = 100M 上传的文件上限

  max_file_uploads = 20 一次允许上传20个文件



　　




												


											
PHP+Ajax实现文件上传功能的更多相关文章
	

    
								
  1. django项目中form表单和ajax的文件上传功能。
		
    form表单文件上传 路由 # from表单上传 path('formupload/',apply.formupload,name='formupload/'), 方法 # form表单文件上传 de ...
    
		
    2. 
						
  2. MVC5：使用Ajax和HTML5实现文件上传功能
		
    引言 在实际编程中,经常遇到实现文件上传并显示上传进度的功能,基于此目的,本文就为大家介绍不使用flash 或任何上传文件的插件来实现带有进度显示的文件上传功能. 基本功能:实现带有进度条的文件上传功 ...
    
		
    3. 
						
  3. jQuery插件AjaxFileUpload文件上传实现Javascript多文件上传功能
		
     Ajax file upload plugin是一个功能强大的文件上传jQuery插件,可自定义链接.或其它元素庖代传统的file表单上传结果,可实现Ajax动态提示文件上传 过程,同时支撑多文 ...
    
		
    4. 
						
  4. python 全栈开发，Day75(Django与Ajax,文件上传,ajax发送json数据,基于Ajax的文件上传,SweetAlert插件)
		
    昨日内容回顾 基于对象的跨表查询 正向查询:关联属性在A表中,所以A对象找关联B表数据,正向查询 反向查询:关联属性在A表中,所以B对象找A对象,反向查询 一对多: 按字段:xx book ----- ...
    
		
    5. 
						
  5. 7 款基于 JavaScript/AJAX 的文件上传插件
		
    本文整理了7款基于JavaScript和AJAX的文件上传插件,这些插件基本上都能实现以下功能: 多文件上传 拖拽操作 实时上传进度 自定义上传限制 希望能为你的开发工作带来帮助. 1.  jQuer ...
    
		
    6. 
						
  6. jQuery的ajax实现文件上传大小限制
		
    用jquery的ajax实现简单的文件上传功能,并且限制文件大小,先上代码. <!DOCTYPE html> <html> <head> <meta char ...
    
		
    7. 
						
  7. Django与Ajax,文件上传,ajax发送json数据,基于Ajax的文件上传,SweetAlert插件
		
    一.Django与Ajax AJAX准备知识:JSON 什么是 JSON ? JSON 指的是 JavaScript 对象表示法(JavaScript Object Notation) JSON 是轻 ...
    
		
    8. 
						
  8. PHPCMS_V9 模型字段添加单文件上传功能
		
    后台有“多文件上传”功能,但是对于有些情况,我们只需要上传一个文件,而使用多文件上传功能上传一个文件,而调用时调用一个文件URL太麻烦了. 使用说明: 1.打开phpcms\modules\conte ...
    
		
    9. 
						
  9. 配置php.ini实现PHP文件上传功能
		
    本文介绍了如何配置php.ini实现PHP文件上传功能.其中涉及到php.ini配置文件中的upload_tmp_dir.upload_max_filesize.post_max_size等选项,这些 ...
    
		
    10. 
		

	


随机推荐
	

    
									
  1. git 安装部署教程
			
    转转改改修修,能用:   查看用户名和邮箱 $ git config user.name $ git config user.email   修改用户名和邮箱 $ git config user.na ...
    
			
    2. 
						
  2. 关于linux crontab定时操作oracle不执行的问题解决方案
			
    问题描述:启动定时任务对oracle表进行操作,但是手动执行脚本无问题,定时任务执行无结果不反馈消息 解决方案:以centos7为例吗,首先确定脚本可手动执行,然后检查/var/log/cron下的日 ...
    
			
    3. 
						
  3. linux配置Anaconda python集成环境
			
    1.下载anaconda与安装 利用anaconda来配置python环境 如果你上面两步已经没有问题了,那么这一步可以省略. 如果你想简单一些,利用anaconda来配置python环境,那么直接从 ...
    
			
    4. 
						
  4. ActiveMQ (三)—持久化消息
			
    ActiveMQ的另一个问题就是只要是软件就有可能挂掉,挂掉不可怕,怕的是挂掉之后把信息给丢了,所以本节分析一下几种持久化方式: 一.持久化为文件 ActiveMQ默认就支持这种方式,只要在发消息时设 ...
    
			
    5. 
						
  5. java中增删改查(CRUD)总结
			
    对于User表增删改查:1:save(保存方法)  view(查询所有记录) update(更新方法) delete(删除方法) 通过method这个参数进行判断执行不同的操作 2: 具体的实现:   ...
    
			
    6. 
						
  6. ID 生成器 雪花算法
			
    https://blog.csdn.net/wangming520liwei/article/details/80843248 ID 生成器 雪花算法 2018年06月28日 14:58:43 wan ...
    
			
    7. 
						
  7. MicrosoftRootCertificateAuthority2011.cer 下载
			
    下载地址:https://files.cnblogs.com/files/hyh123/microsoft-root-certificate-authority.rar 在安装Microsoft .N ...
    
			
    8. 
						
  8. ARM 汇编学习笔记
			
    
			
    9. 
						
  9. ThinkPHP 中使用 IS_AJAX 判断原生 JS 中的 Ajax 出现问题
			
    问题: 在 ThinkPHP 中使用原生 js 发起 Ajax 请求的时候.在控制器无法使用 IS_AJAX 进行判断.而使用 jQuery 中的 ajax 是没有问题的. 在ThinkPHP中.有一 ...
    
			
    10. 
						
  10. Windows FFMPEG开发环境配置
			
    1.去FFMPEG网站上下载Dev版本的库,里面有我们需要的头文件和lib文件,然后下载Shared版本的库,里面有我们需要的dll文件 http://ffmpeg.zeranoe.com/build ...
    
			
    11.