关于ajax和submit的技术结合
发布时间:2020-12-16 01:59:39 所属栏目:百科 来源:网络整理
导读:最近编程有一个需求:本页面上传文件后,弹出模态框,显示后端返回的内容。再根据模态框的指示做其他操作。 $.ajax()提交多次发现总是失败。 发现ajax是不能直接提交"multipart/form-data"类型的数据,需要用到jquery.form.js中的$.ajaxSubmit()方法。 插件
最近编程有一个需求:本页面上传文件后,弹出模态框,显示后端返回的内容。再根据模态框的指示做其他操作。 $.ajax()提交多次发现总是失败。 发现ajax是不能直接提交"multipart/form-data"类型的数据,需要用到jquery.form.js中的$.ajaxSubmit()方法。 插件下载地址:http://plugins.jquery.com/form/ 你的模板XXX.html:
<script> function file_upload(){ var thisForm = $("form[enctype='multipart/form-data']"); var options = { url: xxx,type: "post",dataType: "json",data: $(thisForm).serializeArray(),success: function(data){ var content = JSON.stringify(data); }); } } $(thisForm).ajaxSubmit(options); $(thisForm).resetForm(); //表单重置 return false; //阻止默认行为 } </script> <form action="" method="post" enctype="multipart/form-data" role="form"> ......此处省略几百字 <input type="button" onclick="return file_upload();"/> </form> 注意上面的“提交”按钮的type不要设为"submit",否则表单默认跳转action后的url,提交给action对应的处理函数处理。 当然,$("form[enctype='multipart/form-data']").submit({})方法也是不可用的。 onclick事件需要return ,否则也会有其默认行为。 (编辑:李大同) 【声明】本站内容均来自网络,其相关言论仅代表作者个人观点,不代表本站立场。若无意侵犯到您的权利,请及时与联系站长删除相关内容! |