Jquery 在ajax表单中启动文件上载而不提交整个表单

我有一个有几个字段的表单。其中一个字段需要上载documentation.doc、.docx、.pdf文件。表单是一个AJAX表单，设置为每当用户离开模糊字段时，字段内容都会被AJAX传递到某个php，并保存到MySQL数据库中。大多数情况下，表单都是有效的。我对AJAX还不熟悉，对JS真的不太在行，但我似乎无法让文件上传部分按我所希望的方式工作。目前，我正在反复讨论这个问题：

直接相关的html：

   <td class="center" colspan="3">
    <input type="file" name="myfile"> <input type="submit" value="Upload">
    <div class="uploadProgress" style="border: 1px dotted green;">
     <div class="bar"></div>
     <div class="percent">0%</div>
     <div id="status"></div>
    </div>
    <div id="fileList"></div>
   </td>

我正在使用jQuery和jQuery.form.js

目前，我只想让表单的这一部分与php文件对话，但它似乎希望html5验证标记为必需的其他字段，而不是忽略它们并上传所选文件。我如何让它这样做？我不希望每次有人点击上传按钮时都提交整个表单，我只希望处理单个文件

一旦我可以将它放到php文件中，我就可以很容易地处理它，并希望能够找到如何从那里返回结果列表的输出。因此，问题在于如何从一开始就做到这一点

链接到我试图使用文件上传功能的页面的一个小部分。这显示了从现在开始的情况

提前感谢

ajaxForm准备了一个要提交的表单，这意味着您不能以这种方式仅提交表单的单个元素

另一方面，在文件上传的情况下，不能以绕过html5对其他元素验证的方式实现ajaxForm

因此：

您可以使用不同的库，这些库只允许从html文件输入上载文件，例如。 下面是一个示例，说明如何在没有表单的情况下仅实现文件上载。 您可以从表单中删除file upload元素，并将其放入另一个单独的表单中，这样文件上载表单就不会干扰其他表单。

---

如果你只想提交输入文件，那么你不应该提交整个表单上传文件就是整个表单，对吗？或者您只是想通过其他字段的验证？@BardhLohaj uploadFile不是整个表单，该值最初出现在演示“表单”中，而“表单”是演示中的整个表单。然而，我尝试更改它，并将uploadFile分配给文件选择器，然后再分配uploadFile按钮，但两者都没有起到作用。我曾考虑过破坏表单，并在单独的表单中处理文件上载。但这将是不整洁的，因为这在初始形式的中间是相当好的。使用不同的方法/库听起来是个好主意。你能建议如何实现这一点吗？我添加了一个jQuery文件上传示例的链接。这对你有帮助吗？好的，那特别酷。除了同样的问题。我花了好几个小时试图将Basic Plus UI版本合并到我的页面中，它看起来很不错！但是当我试图上传一个文件时，表单报告了完全相同的问题。虽然情况看起来不错，但问题依然存在。上传文件时不应提交表单。你还在这样做吗？或者哪个表单报告了相同的问题？我正在处理，很快会发布结果。我现在正在使用中断表单并插入一个新表单，专门用于文件idea。

// AJAX file uploader
(function() {
    var bar = $('.bar');
    var percent = $('.percent');
    var status = $('#status');

    $('#uploadFile').ajaxForm({
        beforeSend: function() {
            status.empty();
            var percentVal = '0%';
            bar.width(percentVal)
            percent.html(percentVal);
        },

        uploadProgress: function(event, position, total, percentComplete) {
            var percentVal = percentComplete + '%';
            bar.width(percentVal)
            percent.html(percentVal);
        },

        success: function() {
            var percentVal = '100%';
            bar.width(percentVal)
            percent.html(percentVal);
        },

        complete: function(xhr) {
            status.html(xhr.responseText);
        }
    });
})();