没有库的等效代码

Question

我使用了一个教程来获得以下ajax代码。 在教程中，他们有库jquery.form.js 。 这是代码：

function onsuccess(response,status){
    $("#onsuccessmsg").html(response);
        alert(response);
    }
    $("#uploadform").on('change',function(){
        var options={
        url     : $(this).attr("action"),
        success : onsuccess
    };
    $(this).ajaxSubmit(options);
        return false;
});

如果我不想实现jquery.form.js怎么办。 普通ajax（没有库）的等效代码是什么？

更新

我尝试了以下代码：

$("#uploadform").on('change',function(){
                $.ajax({
                    url: $(this).attr("action"),
                    context: document.body,
                    success: function(){
                        $("#onsuccessmsg").html(response);
                        alert("asdf");
                    }
                });
                return false;
            });

它现在什么都不做。

Answer 1

它更像是：（为格式道歉，我在我的手机上）

            $("#uploadform").on('submit',function(e){
                e. preventDefault() ;
                var formData = new FormData($(this)[0]);

                $.ajax({
                    url: $(this).attr("action"),
                    context: document.body,
                    data: formData, 
                    type: "POST",  
                    contentType: false,
                    processData: false,
                    success: function(response, status, jqxhr){
                        $("#onsuccessmsg").html(response);
                        alert("asdf");
                    }
                });
                return false;
            });

您需要通过运行表单字段来手动构建数据变量。 您可能还想查看jquery post ，这是编写上述内容的速记方式。

---

您可以使用这个先前回答的问题来获取您需要传递到 ajax 数据字段的表单数据：

如何使用 Javascript/jQuery 获取表单数据？

还值得注意的是，如果您从表单发布文件，则您的表单必须具有enctype="multipart/form-data" 。 使用 ajax 提交表单时，您需要设置contentType: false, processData: false 。 请参阅此帖子以供参考。

我已经更新了上面的代码片段以反映这一点。

如果这已经回答了您的问题，请将其标记为正确答案。