您的位置：首页 > 其它

一个文件域实现多文件的上传<一>

2016-07-18 19:53 405 查看
一个文件域实现多文件的上传:表单页面：
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8"/>
<title>多文件上传</title>
</head>
<body>
<input type="file" id="file" name="file" multiple="multiple">
<button onclick="xhr2()">多文件上传</button>
<script>
function xhr2(){
var xhr = new XMLHttpRequest(); // 初始化ajax
var file = document.getElementById('file').files; // 定义表单变量
//console.log(file.length); // firbug中调试用
var formData = new FormData(); //新建一个FormData对象
<span style="white-space: pre;">		</span>//追加文件数据
for(i=0;i<file.length;i++){
formData.append("file["+i+"]", file[i]);
}
//formData.append("file", file[0]);

xhr.open('POST', 'files.php'); // 打开一个链接 采用post传值
xhr.send(formData);  //  向服务器发送请求
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 header('content-type:text/html;charset=utf-8');/*循环输出图片的路径并实现添加*/for($i=0;$i<count($_FILES['files']['name']);$i++){$path = "/file/".$_FILES['files']['name'][$i]; // 文件路径move_uploaded_file($_FILES['files']['tmp_name'][$i], $path);}

                                            

                                        

                        
                        内容来自用户分享和网络整理，不保证内容的准确性，如有侵权内容，可联系管理员处理 点击这里给我发消息 
                    

                    

                    

                        

                         标签： 
                                                

                        

                    


                

            


            

                
相关文章推荐

                

                
            

        

        

            

            
            

                

                    
新的分享

                    

                        
                    

                

            


            

                

                    
章节导航