现在我想实现图片上传,而不使用任何插件.
我的上传表单看起来像这样
@H_502_4@<form action="/Member/UploadPicture" enctype="multipart/form-data" id="uploadform" method="post"> <span> <div class="upload" id="imgUpl"> <h3>Upload profile picture</h3> <div class="clear5"></div> <input type="file" name="file" id="file" /> <button class="btn-bl" id="upComplete"><span>Upload</span></button> </div> </span> </form>而我的jQuery代码是：
@H_502_4@$('#upComplete').click(function () { $('#up').hide(); $('#upRes').show(); var form = $("#uploadform"); $.ajax({ type: "POST",url: "/Member/UploadPicture",data: form.serialize(),success: function (data) { alert(data); } }); $.fancybox.close(); return false; });如果我打开firebug,我可以看到ajax()方法做简单的表单(不是多部分),POST内容是空的
是否可以使用jQuery ajax()方法进行文件上传,还是以其他方式进行上传？
非常感谢你
解决方法
jQuery ajax不支持文件上传并手动实现这一点可能很麻烦.我建议你看看jQuery
form插件.
当然,你可以随时查看插件的源代码,看看如果你不想包含它,它是如何实现的(它使用一个隐藏的iFrame,因为文件不能用AJAX上传),但是为什么要这样做呢？它直接:-)
以下是您的代码可能如下所示的示例：
@H_502_4@$(function() { $('#uploadform').ajaxForm(); });也使上传按钮一个提交按钮：
@H_502_4@<button class="btn-bl" id="upComplete" type="submit"> <span>Upload</span> </button>