Question

我的目标是建立一个网站，我可以将多个文件上传到我的网络服务器。这是我的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文件中的“未捕获的TypeError：非法调用”

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

Answer 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链接来阅读它们。

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

1 个答案: