我在用 PHP 制作多文件上传器时遇到了一些麻烦答案

【问题标题】：I'm having some trouble making a multi-file uploader in PHP我在用 PHP 制作多文件上传器时遇到了一些麻烦
【发布时间】：2014-10-08 19:29:01
【问题描述】：

我的目标是建立一个可以将多个文件上传到我的网络服务器的网站。这是我的 HTML 表单：

<form class='form-horizontal'>
  <div class='form-group text-center'>
    <h3>Upload</h3>
  </div>
  <div class='form-group'>
    <label for='file' class='col-sm-3 control-label'>File(s)</label>
    <div class='col-sm-9'>
      <input type="file" id='files' class="form-control text-center" multiple />
    </div>
    <div class='col-sm-12'>
      <br>
      <button type="button" id='submit' class="btn btn-success center-block glyphicon glyphicon-cloud-upload btn-lg" value='Upload' />
    </div>
  </div>
</form>

然后这是我的 Javascript：

$(document).ready(function(){
    var files = [];
    $("#files").bind('change', function() {
        files = this.files
    });
    $("#submit").click(function(){
        //Validate first
        if(files.length > 0){
            var data = {
                files: files
            };
            $.ajax({
                type: "POST",
                url: "<?php echo BASE_URL; ?>/FileUploader/php/uploadFiles.php",
                data: data,
                success: function(response){
                    console.log(response);
                    //$("#files").val("");
                }
            });
        }
    });
});

当我发送 ajax 请求时，控制台中出现错误：jquery.min.js 文件中出现“Uncaught TypeError: Illegal invocation”

有谁知道如何解决这个问题？

【问题讨论】：

您无法通过标准 ajax 调用上传文件。

标签： javascript php html file file-upload

【解决方案1】：

去年夏天我使用 PHP、Javascript 和 AJAX 从头开始。它适用于图像、音频、视频、txt 文件。要查看完整代码，请转到 https://github.com/akshaynagpal/multi_type_upload

HTML

<body>
<h1>Media Upload</h1>
<form name="upload_form" id="upload_form" method="POST" enctype="multipart/form-data">

Select Image: <input type="file" id="uploadimage" name="uploadimage" /><br />
<input type="button" value="Upload Image" name="uploadButton" onclick="showProgressBar();"/>Format allowed:"jpg" "gif", "png" only.<br />
 <div id="progressDiv" style="display:none">
  <progress id="progressBar"  value="0" max="100" style="width:300px;"></progress>
  </div>
  <h3 id="status"></h3>
  <p id="loaded_n_total"></p>

Select Video: <input type="file" id="uploadvideo" name="upload_video" /><br />
<input type="button" value="Upload Video" name="uploadButton" onclick="showProgressBar2();"/>Format allowed:"mp4" only.<br />
 <div id="progressDiv2" style="display:none">
  <progress id="progressBar2"  name="progressbar2" value="0" max="100" style="width:300px;"></progress>
  </div>
  <h3 id="status2"></h3>
  <p id="loaded_n_total2"></p>

</form>
</body>

PHP

$fileName = $_FILES["uploadimage"]["name"]; // The file name
            $fileTmpLoc = $_FILES["uploadimage"]["tmp_name"]; // File in the PHP tmp folder
            $fileType = $_FILES["uploadimage"]["type"]; // The type of file it is
            $fileSize = $_FILES["uploadimage"]["size"]; // File size in bytes
            $fileErrorMsg = $_FILES["uploadimage"]["error"]; // 0 for false... and 1 for true

PHP 和 Javascript 代码有点长，您可以访问上面的 github 链接阅读它们。

【讨论】：