将上传图像保存在没有表单的文件夹中

时间:2018-03-27 15:22:18

标签: php jquery post upload image-uploading

我想从输入中上传图片,并将其保存在一个文件夹中(称为'照片')。 在HTML中,我有一个简单的输入类型文件,如下所示:

<input type="file" name="inputFile" id="inputFile" accept="image/jpeg, 
image/png">
<span>Scegli una foto</span>
<input id="Invia" type="button" value="Invia">

在Javascript中,我使用了这个AJAX调用:

var myFormData = new FormData();
    myFormData.append($("#inputFile")[0].files[0]['name'], $("#inputFile")[0].files[0]);

$("#Invia").click(function (){
    $.ajax({
            type: 'POST',               
            processData: false,
            contentType: false, 
            data: myFormData,
            url: "../api/photo.php",
            dataType : 'json',  
            success: function(jsonData){}
    });
});

在PHP中,&#39; ../ api / photo.php&#39;文件是这样的:

<?php 

header('Content-Type: application/json; charset=utf-8');
$destination= '../app/photos';
$tmp_name = $_FILES["inputFile"]["tmp_name"];
$name = $_FILES["inputFile"]["name"];
move_uploaded_file($tmp_name, "$destination/$name");
?>

但它不起作用。我不是POST方法的专家,所以我不知道自己做错了什么。你能救我吗?

1 个答案:

答案 0 :(得分:1)

问题是因为你的附加值...我在我的本地检查了你的脚本并改变了类似ajax-url和成功消息的东西以方便我这是我的代码请检查并让我知道:

    $("#Invia").click(function (){  
    var form = new FormData();
    var myFormData = document.getElementById('inputFile').files[0]; //get the file 
    if (myFormData) {   //Check the file is emty or not
        form.append('inputFile', myFormData); //append files
    }    
    $.ajax({
            type: 'POST',               
            processData: false,
            contentType: false, 
            data: form,
            url: "test1.php", //My reference URL
            dataType : 'json',  
            success: function(jsonData){
                if(jsonData == 1)
                    $('#img_msg').html("Image Uploaded Successfully");
                else
                    $('#img_msg').html("Error While Image Uploading");
            }
    });
});

您不需要更改您的php文件,但请仔细检查您的文件夹路径是否正确存储图像......