javascript - 无法从php中的ajax访问2个或更多文件

Question

这是我的 PHP 代码

for($x=0; $x<count($_FILES['image1']['name']); $x++ ) {

        // echo "Hello";
        $file_name = $_FILES['image1']['name'][$x];

        $file_size = $_FILES['image1']['size'][$x];
        $file_tmp  = $_FILES['image1']['tmp_name'][$x];
        $lclLocation1 = "http://$_SERVER[HTTP_HOST]/images/".$_FILES["image1"]["name"][0];
        $lclLocation2 = "http://$_SERVER[HTTP_HOST]/images/".$_FILES["image1"]["name"][1];


        $t = explode(".", $file_name);
        $t1 = end($t);
        $file_ext = strtolower(end($t));

        $ext_boleh = array("jpg", "jpeg", "png", "gif", "bmp");

        if(in_array($file_ext, $ext_boleh)) {
            $sumber = $file_tmp;
            $tujuan = "../images/" . $file_name;
            // echo "Image got";
            move_uploaded_file($sumber, $tujuan);

        }
        else  {
            echo "Only Images can be store!";
        }
    } // end for

这是我的ajax查询

  // this contains two images
var lclImage1 = document.getElementById("txtImage1");

    lclImage2 = lclImage1.files[0];

    var formData = new FormData();

    formData.append("image1", lclImage2);

在此之后，我们将使用 ajax 发送到 PHP。

$.ajax({
        url: "user.php",
        type: "POST",
        data: formData,
        processData: false,
        contentType: false

});

上面的 PHP 代码可以很好地直接调用带有文件名的操作我得到了多个值但是如果我使用 ajax 那么它就不起作用

下面是HTML代码

<form name="imgupload" enctype="multipart/form-data" method="post">
     <td rowspan="1">
        <input type="file" id="image1" name="image1[]" multiple>
    </td>
     <input type='submit' name='submit'><br/>
</form>

Answer 1

您需要表单提交事件，ajax 才能按如下方式工作，

<form id="imgupload" name="imgupload" enctype="multipart/form-data" method="post">
    <td rowspan="1">
        <input type="file" id="txtImage1" name="images1[]" multiple>
    </td>
    <input type='submit' name='submit'><br/>
</form>
<script
    src="http://code.jquery.com/jquery-3.3.1.min.js"
    integrity="sha256-FgpCb/KJQlLNfOu91ta32o/NMZxltwRo8QtmkMRdAu8="
crossorigin="anonymous"></script>
<script>

    $('#imgupload').on('submit', function () {

        var formData = new FormData();            
        var count = document.getElementById('txtImage1').files.length;
        for (var x = 0; x < count; x++) {
            formData.append("image1[]", document.getElementById('txtImage1').files[x]);
        }

        $.ajax({
            url: "user.php",
            type: "POST",
            data: formData,
            processData: false,
            contentType: false

        });
        return false;
    });


</script>

用户.php

for($x=0; $x<count($_FILES['image1']['name']); $x++ ) {

    // echo "Hello";
    $file_name = $_FILES['image1']['name'][$x];

    $file_size = $_FILES['image1']['size'][$x];
    $file_tmp  = $_FILES['image1']['tmp_name'][$x];
    $lclLocation1 = "http://$_SERVER[HTTP_HOST]/images/".$_FILES["image1"]["name"][0];
    $lclLocation2 = "http://$_SERVER[HTTP_HOST]/images/".$_FILES["image1"]["name"][1];


    if(($_FILES["image1"]["type"][$x] == "image/gif") || ($_FILES["image1"]["type"][$x] == "image/jpeg") || ($_FILES["image1"]["type"][$x] == "image/png") || ($_FILES["image1"]["type"][$x] == "image/pjpeg")){
        $sumber = $file_tmp;
        $tujuan = "../images/" . $file_name;
        // echo "Image got";
        move_uploaded_file($sumber, $tujuan);

    }
    else  {
        echo "Only Images can be stored!";
    }
} // end for

我还编辑了图像扩展条件。因为文件名中可能包含句点，所以用句点分解名称会导致错误。