使用jquery表单插件通过ajax上传表单

Question

我正在尝试上传以下表单

<form id="filesend" enctype="multipart/form-data" method="post" action="upload.php"> Choose the file you want to send <br> <input name="file" type="file"><br><input type="submit"></form>

使用以下jquery代码

<script>
$('document').ready(function() { 
var options= { target:'#close'}
$('#filesend').submit( function (){
$(this).ajaxSubmit(options);
          return false;         
})})
</script>

但什么也没发生，表单像普通的html表单一样提交，并导航到upload.php，是的，我已经包含了插件。任何关于我可能会出错的想法。

编辑

我刚刚注意到一些有趣的事情。如果我浏览chrome的调试器并观察执行的每一步，文件就会被上传到数据库两次。但是在没有任何断点的情况下执行它只会导致它被上传一次。

Answer 1

问题出在这个部分：

$(#filesend).submit( function (){
    $(this).ajaxSubmit(options);
    return false;         
})

选择器应该是一个字符串，所以：$('#filesend')-注意单引号（也可以使用双引号）。

如果没有它们，它将试图将名为#filesend的变量的值传递给函数；我不确定这是一个有效的变量名，所以它可能会抛出一个错误-检查浏览器的开发工具控制台会告诉你是否因此抛出了错误。

Answer 2

无法通过ajax上传文件。您可以上传文件，而无需使用IFrame刷新页面。您可以在这里查看更多详细信息：

http://www.ajaxf1.com/tutorial/ajax-file-upload-tutorial.html

XHR2支持通过AJAX上传文件。例如通过FormData对象，但不幸的是，并非所有/旧的浏览器都支持它。

Answer 3

我认为您不能使用Ajax提交文件。基于JQuery的文件上传插件允许您"很好地"显示文件上传输入框。

Answer 4

您的代码中存在syantax问题

仔细看这里

$('#filesend').submit( function (){
$(this).ajaxSubmit(options);
          return false;         
})});

选择器需要结束字符串，即'#filesend'。