如何为文件上传表单发布jquery帖子？

我有一个类似这样的表单：

<form id="uploadForm" name="uploadForm" method="post" enctype="multipart/form-data">
    <input type="file" id="uploadFile" name="uploadFile" /><br />
    <input type="submit" id="process" name="process" value="Process File" />
</form>

我想允许用户上传一个文件，然后处理它。当用户点击process时，我想使用jquery post调用此页面，此表单显示在cfwindow中，我不想离开cfwindow，进行一些处理并输出消息。这是我通常使用的代码：

$('#process').click(function(){
    $.post('<cfoutput>#cgi.script_name#</cfoutput>', $('#uploadForm').serialize(), function(data){
        ... some processing ...
    });
});

然而，没有通过任何决议。进一步的调查使我找到了该函数的jquery文档，其中说明：

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

如何传递文件选择元素

如果这有区别-当我发布到页面时，我正在使用此代码读取文件选择元素中上载的文件：

<cfspreadsheet action="read" src="#form.uploadFile#" sheet="1" query="spreadsheetData" headerRow="1" excludeHeaderRow="true">

---

最初我只是使用常规的表单帖子，它工作得非常好。我想切换到ajax，这样我可以保持cfwindow打开，而不是重新加载。

看看这个项目。它允许像您尝试的那样通过XHR上传。您可以使用他的库或使他的概念适应您正在尝试的操作。

传统的解决方法是将表单目标设置为隐藏的iFrame：

<!-- fileupload.cfm -->
<script>function functionToHandleUploadComplete(){ // Do things here }</script>
<form action="getfile.cfm" method="post" target="myHiddeniFrame" />
  <input type="file" name="myFile" />
  <!-- your fields -->  
</form>

<iframe id="myHiddeniFrame" style="somthing to hide the frame" />

<!-- getFile.cfm loaded in an iFrame within fileUpload.cfm-->
<cffile action="upload" formField="myFile" ..... />
<cfoutput>
  <script>
    window.parent.functionToHandleUploadComplete();
  </script>
</cfoutput>

我们在产品中使用这种方法，效果很好。如果您发送到的页面位于同一个域中，您可以让它推出javascript以告知包含页面上载已完成

---

不过，我还是先看一下文件上传程序项目，因为它看起来相当漂亮。

我不确定我是否理解这一点-我应该把代码放在哪里来处理我的处理？是的，答案有点太简短了，希望现在稍微清楚一点谢谢！我想我可以尝试使用jquery表单插件来代替。。。我最终使用了jquery表单插件，但我会接受这个答案，因为我本可以同样轻松地使用你的插件，它将我引向了正确的方向：