input标签file类型，选择多个文件进行上传

来源：互联网发布：手机淘宝新用户注册编辑：程序博客网时间：2024/05/21 07:00

html页面

   <!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      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));      }      ?>

0 0