POST方法使用PHP和AJAX的Multipart / form-data问题[重复]

Question

我在 PHP 中创建了一个表单，以便在我的数据库中插入表单中的图像。表单有效，我的 Ajax 请求也有效。问题是当我想在'../uploads' 存储库中插入我的图像时，我必须使用$_FILES 方法，而当我的ajax 请求不再工作时......我不明白，我创建了另一个表单只是为了测试我在存储库中插入图像的 php 代码是否正确。 我做了研究，我认为它可以链接到 ajax 中的multipart/form-data（我对 AJAX 了解不多，真的）。 有人能帮助我吗 ？ 这是我的代码：

形式：

<form action="traitement.php" method="post" enctype="multipart/form-data" id="form_img">
   Choose a file<input type="file" name="fileToUpload" id="fileToUpload">
   <button type="submit" name="submit_btn" id="submit_btn">OKK</button>
</form>

php 的特点：

$target_dir = "../uploads/";
$target_file = $target_dir.basename($_POST['fileToUpload']);
//$exec is my sql request to insert the image (and it works).
if ($exec){ 
                echo "Success";
                move_uploaded_file($_FILES["fileToUpload"]["tmp_name"], $target_file);
            }

我的 ajax 请求：

$("#form_img").submit(function(e){
            e.preventDefault();
    
            $.post(
                'traitement.php', 
                {
                    fileToUpload : $("#fileToUpload").val()                    },
    
                function(data){
                    if(data == 'Success'){
                     $("#text_ajt").removeClass('text-warning').addClass('text-success').html("cool");
                    }
                    if(data == 'Failed'){
                        $("#text_ajt").addClass('text-danger').html("respect the format");
                    }
                    if(data == 'Miss'){
                        $("#text_ajt").addClass('text-warning').html("miss something");
                    }
                },
                'text'
            );
        });

Answer 1

这里不需要 Ajax。 只需将您的表单（使用目标）发送到隐藏的 iframe 并为您的 iframe 编写加载事件。

类似这样的：

HTML：

<form action="traitement.php" method="post" enctype="multipart/form-data" target="file_upload_frame" id="form_img">
   Choose a file<input type="file" name="fileToUpload" id="fileToUpload">
   <button type="submit" name="submit_btn" id="submit_btn">OKK</button>
</form>

<iframe id="file_upload_frame" name="file_upload_frame" frameborder="0" style="display: none"></iframe>

jQuery:

$('#file_upload_frame').on("load", function () {
    var response = $(this).contents().find('body').html()
           
    alert(response );
});