手机网站跳转怎么做,网站编辑是个长期做的工作吗,省住房和城乡建设厅,响应式网站应用这次给大家带来ajax怎样提交form表单与实现文件上传#xff0c;ajax提交form表单与实现文件上传的注意事项有哪些#xff0c;下面就是实战案例#xff0c;一起来看一下。前几天#xff0c;发现了一些小问题。我在写后台管理页面时#xff0c;需要上传一张图片。于是我就用…这次给大家带来ajax怎样提交form表单与实现文件上传ajax提交form表单与实现文件上传的注意事项有哪些下面就是实战案例一起来看一下。前几天发现了一些小问题。我在写后台管理页面时需要上传一张图片。于是我就用很普通的Form表单上传有一段Json串和图片文件Form表单上传图片只需要在标签里加上enctype multipart/form-data这样是可以上传图片的但问题来了在我进行用Form表单提交的时候直接跳出来提交返回值的页面并且原先的页面刷新这样我们可以先到异步的Ajax可以实现局部刷新废话不多说了 直接上代码首先是html类型: 名称: 开始时间: 结束时间: 省: 市: 门店: 具体地址: 上传图片: 保存取消以上是html代码为了方便大家copycss直接在标签里了有很多朋友想问为什么写两个form表单这是因为根据后台接收数据的需求传的是信息变成字符串和图片首先把信息变成字符串再放到第二个Form表单里细心地朋友发现在第二个form表单里标签里style“displaynone”这是个隐藏的标签不错我是通过第一个form表单获取的数据通过js变成字符串再放到隐藏的标签里这样通过Ajax提交第二个Form表单就可以了js代码$( #sub ).click( function () {var actTimeStart1 $ (#actstarttime) . datebox (getValue);var actTimeStart changeDateToLong(actTimeStart1);var actTimeEnd1 $(#actendtime).datebox(getValue);var actTimeEnd changeDateToLong(actTimeEnd1);if(actTimeStart ! actTimeEnd ! (actTimeStart - actTimeEnd 0)){$.messager.alert(警告,结束时间不能小于开始时间,error);return false;}else{if ($(#form_insert).form(validate)) {var actType document.getElementById(acttype).value;var actName document.getElementById(actname).value;var actArea document.getElementById(actadd).value;var actTimeStart1 $(#actstarttime).datebox(getValue);var actTimeStart changeDateToLong(actTimeStart1);var actTimeEnd1 $(#actendtime).datebox(getValue);var actTimeEnd changeDateToLong(actTimeEnd1);var t2 $(#mem_Shop).combobox(getValue);var jsonObj {actType:actType,actName:actName,actTimeStart:actTimeStart,actTimeEnd:actTimeEnd,actArea:actArea,t2:t2};var activityMemberJson JSON.stringify(jsonObj);document.getElementById(Item).valueactivityMemberJson;var form new FormData(document.getElementById(form_sub));$.ajax({url : ../activity/actionActivityInsert, //http://www.cnblogs.com/jayxxxxxxx/type : post,data : form, //第二个Form表单的内容processData : false,contentType : false,error : function(request) {},success : function(data) {$(#box).datagrid(reload);}});window_open($(#insert_form), close);}else {$.messager.alert(警告 , 信息不完整! , error);}}});大家看到了我用了FormData方法说真的这个在html5里实在是太好用了上传图片都不用再写enctype multipart/form-data相信看了本文案例你已经掌握了方法更多精彩请关注php中文网其它相关文章推荐阅读
