前端显示界面： 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. 黑an网络---an网入门
			
    我认为学网络的会上an网也是一项必备的技能,我不是鼓励你去犯罪而是保护自己的个人隐私免遭被侵害.an网和shen网实际上都是从英文翻译来的,an网即Dark Net或Dark Web,shen网则译为 ...
    
			
    2. 
						
  2. python 如何编写一个自己的包
			
    python 如何编写一个自己的包 先写function 内容 package/wadepypk$ ls __init__.py f1.py f2.py f1.py def show(): print ...
    
			
    3. 
						
  3. 在Django中运行ExtJS 事例
			
    网上关于ExtJS的事例挺多的,但是在Django中使用ExtJS挺少的,当然了,一些大牛觉得ExtJS运用在页面上是很简单的事,但是对于菜鸟来说,实在有点困难. 我这个例子是用在了sublime3这 ...
    
			
    4. 
						
  4. Oracle创建用户角色
			
    正在维护一个CS结构的应用,每次创建应用的用户时都需要创建对应的数据库schema,并且需要赋予其相应的对象权限和角色.操作很不方便,所以专门创建了一个角色,过程如下: 1.创建角色 SQL>  ...
    
			
    5. 
						
  5. dbca建库--linux上使用vnc图形化安装oracle10g版本
			
    选择创建数据库 配不配置em,自己决定,我们选择配置 配置下面账户密码,在项目中,下面账户肯定是不相同的,我们这里输入相同的,密码为oracle10g 选择文件系统存放(asm和字符设备暂时不能存放) ...
    
			
    6. 
						
  6. python中使用 C 类型的数组以及ctypes 的用法
			
    Python 在 ctypes 中为我们提供了类似C语言的数据类型, 它的用途(我理解的)可能是: (1) 与 其他语言(如 C.Delphi 等)写的动态连接库DLL 进行交换数据,因为 pytho ...
    
			
    7. 
						
  7. php7 使用dom动态生成xml文档
			
    <?php $dom = new DomDocument('1.0','gb2312'); //创建DOM对象 $store = $dom->createElement('store'); ...
    
			
    8. 
						
  8. Skin Microstructure Deformation with Displacement Map Convolution项目小结
			
    经常有人问我你最近在干什么,但一句话真的很难说明白,最近两个月一直在尝试将Skin Microstructure Deformation with Displacement Map Convoluti ...
    
			
    9. 
						
  9. mongodb 导入文件
			
    linux命令:mongorestore -d db_name 文件夹目录 windows命令:mongorestore.exe -d db_name 文件夹目录
    
			
    10. 
						
  10. SpringMVC Mybatis Spring
			
    Spring MVC Mybatis整合过程中 Mapper.java 不需要使用 @componenet, Service 等spring注解 但是在service 中创建mapper对象的时候是需 ...
    
			
    11.