多图上传问题

Question

我想在数据库中插入多张图片。提交时，我在 $_FILES[] 中只得到一张图片的详细信息。为什么其他提交的图片没有显示在数组中？

此外，upload.php 有错误说明 C:\xampp\htdocs\kabootar\upload.php 中第 15 行的数组到字符串的转换，即

$targetFile = $targetDir.$fileName;

我该如何解决这些问题？

html

    <form action="upload.php" method="post" enctype="multipart/form-data">
        <input type="submit" value="Upload" name="upload">

        <label class="add">Select more..</label>
         <div class="prep">

        <div class="col-md-4">
            <img src="http://png-4.findicons.com/files/icons/129/soft_scraps/256/button_upload_01.png" id="upfile1" style="cursor:pointer" class="img" />
   <input type="file" class="inputimg" name="multiple_uploaded_files[]" />
        </div>


         </div>

    </form>

javascript

<script type="text/javascript">
$(document).on("click", ".img", function () {

    $(this).closest("div").find(".inputimg").trigger("click");
});

var count = 1;
$(".add").on("click", function () {
    count++;
    if(count <= 5){
        var row = '<div class="col-md-4"> <img src="http://png-4.findicons.com/files/icons/129/soft_scraps/256/button_upload_01.png" id="upfile1" style="cursor:pointer" class="img"/ ><input type="file" class="inputimg" />\n\
       ';
    $(".prep").append(row);

    $(".inputimg").change(function () {
        console.log(this);
        readURL(this);
    });
    }else{
        alert('You are only allowed to add uptp 5 images');
    }


});
$(".inputimg").change(function () {
    readURL(this);
});

function readURL(input) {
    if (input.files && input.files[0]) {
        var reader = new FileReader();

        reader.onload = function (e) {
            $(input).siblings('.img').attr('src', e.target.result);
        }

        reader.readAsDataURL(input.files[0]);
    }
}
</script>

upload.php

if(isset($_POST['upload']))
{

if(!empty($_FILES)){

  foreach ($_FILES['multiple_uploaded_files']['name'] as $file)
 {
    $targetDir = "upload/";
    $fileName = $_FILES['multiple_uploaded_files']['name'];   
    $targetFile = $targetDir.$fileName; 
        //use the move_uploaded_file() to move your file on your server directory.
if(move_uploaded_file($_FILES['multiple_uploaded_files']['tmp_name'][$file], $targetFile))
{
        //insert file information into db table
 $sql = mysqli_query($link,"INSERT INTO files (file_name, uploaded) VALUES('".$fileName."','".date("Y-m-d H:i:s")."')");
 echo 'file inserted';  
 }
    else
    {
        echo 'Query not working';
    }

}
        //fire an insert query that inserts all the file names with comma separated value
    }
else
{
    echo 'No file selected';
}

Answer 1

您正在尝试将字符串与数组 $_FILES['multiple_uploaded_files']['name'] 连接起来。对于数组到字符串的转换错误

替换代码

$fileName = $_FILES['multiple_uploaded_files']['name'];

和

$fileName = $file;   (or)
$fileName = $_FILES['multiple_uploaded_files']['name'][0];

单个文件上传问题。您尚未在 javascript 代码中为输入标签添加名称属性。

替换

    var row = '<div class="col-md-4"> <img src="http://png-4.findicons.com/files/icons/129/soft_scraps/256/button_upload_01.png" id="upfile1" style="cursor:pointer" class="img"/ ><input type="file" class="inputimg" />\n\';

与

    var row = '<div class="col-md-4"> <img src="http://png-4.findicons.com/files/icons/129/soft_scraps/256/button_upload_01.png" id="upfile1" style="cursor:pointer" class="img"/ ><input type="file" class="inputimg" name="multiple_uploaded_files[]"/>\n\';

注意：在输入标签中添加了名称属性。

多图上传问题

Multiple images uploading issue

javascript

php

image-uploading

filereader