Question

由于某种原因，我无法使以下脚本正常工作，在不使用脚本的情况下提交表单时，所有工作都应该正常，但是当使用脚本提交表单时，我只能在帖子中获取类别和描述变量但没有文件。所以我的问题是如何让脚本也发布文件变量。

的Ajax

$("#img-post").click(function()
{
    $("#imgupload").submit(function(e)
    {
        var postData = $(this).serializeArray();
        var formURL = $(this).attr("action");
        $.ajax(
        {
            url : formURL,
            type: "POST",
            data : postData,
            success:function(data, textStatus, jqXHR) 
            {
                $("#img").html('<pre><code class="prettyprint">'+data+'</code></pre>');

            },
            error: function(jqXHR, textStatus, errorThrown) 
            {
                alert('Error');
                document.getElementById('enquiry').style.visibility = 'hidden';
            }
        });
        e.preventDefault(); //STOP default action
    });

    $("#imgupload").submit(); //SUBMIT FORM
});

HTML

<div class="img" id="img"></div>

<form name="imgupload" id="imgupload" action="upload.php" method="post" enctype="multipart/form-data">
<input name="category" id="category" type="text" />
<input name="file" id="file" type="file" />
<textarea name="discription" id="discription" cols="68%" rows="8"></textarea><br>
<input type="button"  id="img-post" name="img-post" value="Add" />
</form>

Answer 1

文件选择元素中的数据未序列化

摘自文档页面：

https://api.jquery.com/serializeArray/

但是，您可以使用此处的jquery ajax表单插件来实现此目的：

http://malsup.com/jquery/form/

这个插件很不错，因为它不仅可以捕获表单数据（包括文件），还可以轻松地在ajax调用的$_POST属性中发送额外的data数据以及表单。

使用Ajax发布multipart / form-data

1 个答案: