mysql - 将隐藏文件输入的值插入数据库？

Question

我想将隐藏文件输入的值插入数据库，但我不确定如何插入。我的代码只是不断向数据库插入空白值，但我想插入正在上传的文件名。这是我的代码:

<form action="handler.php" method="post" enctype="multipart/form-data">
    <div id="bd1" class="border">
        <input id="inp1" class="imginp" type="file" name="img1" hidden>
        <img src="https://img.icons8.com/wired/64/000000/add-image.png">
    </div>
    <input type="submit" name="submit">
</form>

<script>
for (let a = 1; a < 3; a++) {
    $("#bd"+a).click(function(e) {
        $(this).children(".imginp").click()
    });
    $('#inp'+a).click(function (e) {
       e.stopPropagation();
    });

    $('#inp'+a).on('change', function(e){
      var files = e.target.files;
      $.each(files, function(i, file){
        var reader = new FileReader();
        reader.readAsDataURL(file);
        reader.onload = function(e){
            template = 
            '<div class="border">'+
                '<input id="inp'+a+'" class="imginp" type="file" name="img'+a+'">'+
                '<img class="blah" src="'+e.target.result+'">'+
            '</div>';
            $('#bd'+a).replaceWith(template);
        };
      });
    });
}
</script>

if (isset($_POST['submit'])) {
    $img1 = $_FILES['img1']['name']; 
    $img1targ = "images/".basename($_FILES['img1']['name']);
    $img1muf = move_uploaded_file($_FILES['img1']['tmp_name'], $img1targ);

    $stmt = $conn->prepare("INSERT INTO images (img1) VALUES (?)");
    $stmt->bind_param("s", $img1);
    $stmt->execute();
    $stmt->close(); 
}

Answer 1

您正在使用 JavaScript 动态覆盖输入字段，实质上是在提交之前将其删除。

文件输入字段由浏览器控制。如果您在 Chrome 中进行调试(按 F12，然后右键单击并检查)，您会注意到"file"类型的输入字段实际上从未改变。没有值字段，什么都没有。

请参阅这篇优秀的文章: Using readAsDataURL() for image preview

我相信这很接近您想要做的事情。

此外，关于调试，您需要执行以下操作:

if (isset($_POST['submit'])) {
print "<pre>" . print_r($_POST,TRUE) . "</pre>"; exit;
    $img1 = $_FILES['img1']['name']; 
    $img1targ = "images/".basename($_FILES['img1']['name']);
    $img1muf = move_uploaded_file($_FILES['img1']['tmp_name'], $img1targ);

    $stmt = $conn->prepare("INSERT INTO images (img1) VALUES (?)");
    $stmt->bind_param("s", $img1);
    $stmt->execute();
    $stmt->close(); 
}

我添加了转储 $_POST 然后退出的打印行。

当你点击提交时，它会显示类似这样的内容:

Array
(
    [submit] => Submit
)