javascript - 通过javascript将文件从html形式发送到php

Question

我用 JavaScript 创建了一个表单。我不想在这上面有一个提交按钮，因为它只是一个输入字段。为了做到这一点，我只使用了 onchange 函数。所以我的表单如下所示...

<form method="post" name="uploadImage">
<input type="file" id="uploadImg" name="uploadImg" onchange="fileClick()" />
</form>

然后为了使表单提交，我使用了js提交功能。所以我的 JavaScript 如下。

function fileClick(){

document.forms["uploadImage"].submit();

$.post(
"uploadImage.php",
{image : $("#uploadImg").val()},
function(data, status){
alert(data);
$("#uploadedImgs").innerHTML = "<img src='" + data + "' alt='uploadedImg' />";
});
}
</script>

(是的，我已经正确包含了 JQuery)但是当我尝试使用这个将我的数据提交到 php 文件时，我不断收到它说 $_FILES['image'] 为空。我的 php 代码如下。

<?php
if($_FILES['image']){
echo "Image set";
} else {
echo "No image selected";
}
?>

非常感谢任何帮助。另外，如果您有一种更简单的方法来做我想做的事情，所有建议都会被接受。感谢大家的帮助。 :D

(帖子后的最后说明)是的，我知道也有与此非常相似的问题，但其中大多数比我使用 Javascript 的问题要高级得多。虽然这很简单，但对我来说，弄清楚如何让它发挥作用却非常困难且耗时。所以请不要标记为重复，因为我无法理解其他人的答案。抱歉:(

Answer 1

我使用ajax来做这样的事情。此代码在文件选择器值更改时触发。它发布图像值，并提醒响应。

$("#uploadImage").change(function(event) {
    var values = $(this).serialize();
    $.ajax({
        url: "uploadImage.php",
        type: "post",
        data: values,
        success: function(response){
            alert(response);
        },
        error:function(){
            //Error
        }
    });
});