jquery - 使用 ajax 上傳圖像文件不起作用

Question

我想通過 jquery 和 ajax 提交我的圖像，這是我的代碼：

    <form name="photo" id="imageUploadForm" enctype="multipart/form-data" action="<?php echo $base_url ?>admin/resid.php" method="post">
    <input type="file" accept="image/*" id="imguploadresid" /> 
</form>

<Script>

$("#imguploadresid").on("change", function() {
        $("#imageUploadForm").submit();
});
    
$('#imageUploadForm').on('submit',(function(e) {
        e.preventDefault();

        var form = $('#imageUploadForm')[0];
        var formData = new FormData(form);
  
        $.ajax({
            type:'POST',
            url: "<?php echo $base_url ?>admin/resid.php",
            data:formData,
            cache:false,
            enctype: 'multipart/form-data',
            contentType: false,
            processData: false,
            success:function(data){
                console.log("succes")
            },
            error: function(data){
                console.log("error");
            }
        });
    }));

只是添加一些解釋，當使用選擇圖像時，表單會立即提交。

它工作正常並將數據發布到我的 php 頁面，但它是空的並且沒有數據

我把 print_R($_POST) 放在我的頁面中，結果是

Array

( )

我記錄了 ajax 帖子並且沒有數據發布。

問題是什么？

Answer 1

您的圖像可能在 PHP 數組 $_FILES 中。 您必須從中下載文件才能獲取圖像。

$yourImage = file_get_contents($_FILES['image']['tmp_name']);

您還必須在輸入中添加“名稱”屬性：

<form name="photo" id="imageUploadForm" enctype="multipart/form-data" action="<?php echo $base_url ?>admin/resid.php" method="post">
  <input name="image" type="file" accept="image/*" id="imguploadresid" /> 
</form>