多文件上传（input标签file）

最新推荐文章于 2024-04-11 17:48:18 发布

dear_Zzzx

最新推荐文章于 2024-04-11 17:48:18 发布

阅读量934

点赞数

分类专栏： PHP

本文链接：https://blog.csdn.net/dear_zx/article/details/51751184

版权

PHP 专栏收录该内容

7 篇文章 0 订阅

订阅专栏

html页面

[html]view plaincopy 
   
 <!DOCTYPE html>  
 <html>  
     <head>  
         <meta charset="UTF-8"/>  
         <title>xhr2</title>  
     </head>  
     <body>      
         <div style="text-align:center;margin:100px">        
             <input type="file" id="file" name="file" multiple="multiple">  
             <button onclick="xhr2()">多文件上传</button>  
         </div>          
         <script>  
         function xhr2(){  
             var xhr = new XMLHttpRequest();//第一步  
             //定义表单变量  
             var file = document.getElementById('file').files;  
             //console.log(file.length);  
             //新建一个FormData对象  
             var formData = new FormData(); //++++++++++  
             //追加文件数据  
             for(i=0;i<file.length;i++){    
                  formData.append("file["+i+"]", file[i]); //++++++++++  
             }   
             //formData.append("file", file[0]); //++++++++++  
               
             //post方式  
             xhr.open('POST', 'xhr2.php'); //第二步骤  
             //发送请求  
             xhr.send(formData);  //第三步骤  
             //ajax返回  
             xhr.onreadystatechange = function(){ //第四步  
         　　　　if ( xhr.readyState == 4 && xhr.status == 200 ) {  
         　　　　　　console.log( xhr.responseText );  
         　　　　}  
         　　};  
             //设置超时时间  
             xhr.timeout = 100000;  
             xhr.ontimeout = function(event){  
         　　　　alert('请求超时！');  
         　　}   
         }  
         </script>  
     </body>  
 </html>  

php处理页面

[php]view plaincopy 
   
 <?php  
 print_r($_FILES["file"]);  
   
 for($i=0;$i<count($_FILES["file"]['name']);$i++){  
 $name=$_FILES["file"]["name"][$i];  
 move_uploaded_file($_FILES["file"]["tmp_name"][$i],iconv("UTF-8","gb2312",$name));  
 }  
   
 ?>  

dear_Zzzx

关注

0
点赞
踩
1

收藏

觉得还不错? 一键收藏
0
评论
多文件上传（input标签file）

html页面[html] view plain copy > html> head> meta charset="UTF-8"/> title>xhr2title> head> body> div style="text-
复制链接

扫一扫