使用jquery FormData()方法上载多个图像时出错

时间:2018-08-05 14:41:31

标签: php jquery html ajax

下面是我的Javascript和HTML代码:

$('#uploadImage').submit(function(e){ //redirect the page 
    e.preventDefault();
    $.ajax({ 
        url: 'upload.php',
        type: "POST",
        data: new FormData(this),
        contentType: false,
        cache: false,
        processData: false,
        xhr: function () {
                            var xhr = new window.XMLHttpRequest();
                            $(".progress").show();
                            $('.progress-bar').text('0%');
                            $('.progress-bar').css('width', '0%');
                            xhr.upload.addEventListener("progress", function (evt) {
                                if (evt.lengthComputable) {
                                    var percentComplete = evt.loaded / evt.total;
                                    percentComplete = parseInt(percentComplete * 100);
                                    $('.progress-bar').text(percentComplete + '%');
                                    $('.progress-bar').width(percentComplete + '%');
                                }
                            }, false);
                            return xhr;
                        },
        success: function(data){
            $(".preview").html(data).delay(5000).fadeOut();
            $(".progress").delay(5000).fadeOut();

        },
        error: function(){}
    });
    });
<form id="uploadImage" action="upload.php" enctype="multipart/form-data" class="form-horizontal" method="post">
                 <div class="progress" style="display:none">
                  <div class="progress-bar" role="progressbar" aria-valuenow="0"
                  aria-valuemin="0" aria-valuemax="100" style="width:0%">
                    0%
                  </div>
                </div><br>
              <input list="name" name="name" placeholder="Enter Gallery Name" autocomplete="off">
  				<datalist id="name" class="name">
  				</datalist><br><br>
              <label class="btn btn-success btn-file">
                Browse<input type="file" name="image[]" class="form-control" id="file-up" multiple/>
              </label><br><br>
                <button type="submit" class="btn btn-primary upload-image">Upload Image</button>
</form>

我正在使用$_FILES['image']['name']从服务器端PHP文件访问图像。但是问题在于,AJAX发送了一个空数组。为什么会这样呢?预先感谢。

0 个答案:

没有答案