formdata 嵌套_如何实现在表单中嵌套表单来上传文件

有的时候需要使用表单来上传文件，实现起来前后端都简单，但是有的情形下前端实现起来就非常麻烦了，原因无非有几个：

1、表单提交之后表单会跳转

2、表单提交之后怎么获得结果？

3、文件上传的表单外面还有表单怎么办？

这里我直接将方案：

1、在form上设置target，让target的目标到页面当中的一个空的iframe

2、想获取结果那么就是要有回调方法，这个可以从改造接口开始

接口返回的格式模仿jsonp，返回的是可运行的js，如：

parent.Callback({回调数据})//由于执行的js是在iframe当中，所以需要加上parent

这样在自己的JS里面写入一个 接收数据的回调方法如

function Callback (data) {

alert(data)

}

3、首先你得知道表单是不能嵌套表单的，这是规定。然后你要想实现表单的“嵌套”，我给出2个方法

1、给文件上传的表单设置绝对定位，以看起来是在主表单中

2、当操作文件上传表单的时候再给文件上传的地方加上表单，操作完成之后就删除，如使用jquery的wrap()方法和unwrap()方法

$(‘.file’).change(function() {

$(this).wrap(‘

$(‘.form-upload’).get(0).submit();

}

当文件上传获得回调的时候删 unwrap()掉form即可

本文来自互联网用户投稿，文章观点仅代表作者本人，不代表本站立场，不承担相关法律责任。如若转载，请注明出处。 如若内容造成侵权/违法违规/事实不符，请点击【内容举报】进行投诉反馈！