前端显示界面： 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. hello1 hello2 代码分析
			
    1.hello1代码分析 hello.java package javaeetutorial.hello1; import javax.enterprise.context.RequestScoped ...
    
			
    2. 
						
  2. 改变一下主要发博的方向吧...转scratch!
			
    因为expression2实在是没什么好说的,BUI,水滴鱼大佬还有其他贴吧上的大佬,实在是多得不行,我一个小人物也说不了什么,然而scratch我却可以多发发脚本,思路,美工啊等等.所以以后我就主要 ...
    
			
    3. 
						
  3. maven多模块项目构建
			
    描述 一个大的企业级项目通常跨越了数十万行代码,牵涉了数十或数百软件人员的努力.如果开发者在同一个项目下开   发,那么项目的管理.构建将会变得很难控制.因此设计人员会将项目划分为多个模块,多个模块独 ...
    
			
    4. 
						
  4. Day 22  初识面向对象
			
    一.两种编程思想 1.面向过程编程 核心是'过程',过程指的是解决问题的步骤,就是先干什么再干什么 基于面向过程思想编写程序相当于写一条流水线,是一种机械式的思维方式 优点:解决问题的思路清晰,可以把 ...
    
			
    5. 
						
  5. ulimit -a
			
    在linux中执行ulimit -a 即可查询linux相关的参数 用ulimit命令是可以修改这些配置的命令的格式:ulimit [-SHacdefilmnpqrstuvx] [limit] 中间的 ...
    
			
    6. 
						
  6. LCD LED OLED区别 以及RGB、YUV和HSV颜色空间模型
			
    led 液晶本身不发光,而是有背光作为灯源,白色是由红绿蓝三色组成,黑色是,液晶挡住了led灯光穿过显示器. lcd比led更薄. oled:显示黑色时,灯是灭的,所以显示黑色更深,效果更好. 这就不 ...
    
			
    7. 
						
  7. Apache Atlas元数据管理从入门到实战(1)
			
    一.前言   元数据管理是数据治理非常重要的一个方向,元数据的一致性,可追溯性,是实现数据治理非常重要的一个环节.传统数据情况下,有过多种相对成熟的元数据管理工具,而大数据时代,基于hadoop,最为 ...
    
			
    8. 
						
  8. 从零开始编译Poco C++和VS2015环境配置
			
    Poco C++是一个C++的开源框架,详细介绍可以问百度介绍更详细,这里我就记录下我从零编译poco-1.9.0和配置 VS2015的环境,以备不时之需. 步骤:一.安装cmake: 二.编译poc ...
    
			
    9. 
						
  9. 2018-2019-20175334实验二《Java面向对象程序设计》实验报告
			
    2018-2019-20175334实验二<Java面向对象程序设计>实验报告 一.实验内容及步骤 实验二面向对象程序设计-1 参考 http://www.cnblogs.com/roce ...
    
			
    10. 
						
  10. 廖雪峰Java8JUnit单元测试-2使用JUnit-3参数化测试
			
    参数化测试: 可以把测试数据组织起来 用不同的测试数据调用相同的测试方法
    
			
    11.