Javascript 同时提交多个Web表单的方法
更新时间：2009年02月19日 23:39:58 作者：
1 问题来自一位网友的提问：
web页面里有多个表单，每个表单对应着某一类数据操作。
比如一个详细的简历信息页面分 1、个人资料 2、工作经验 3、项目经验 4、其他信息 4个表单。
一般的需求是允许用户单独提交其中任何一个表单到下一个页面进行修改操作（也就是说页面有4个不同的修改按钮,点击哪个按钮则只提交某一个表单的数据到服务器，并根据表单的action）。
现在有这样的需求，允许用户选择其中任意的一个或多个表单进行提交修改，这样的话在客户端如何提交表单？
声明：可能会有人说将4个表单合成一个大表单，根据修改按钮的不同在服务器端进行不同的数据操作即可。这是一种解决办法，但考虑到页面数据量比较大，为了提高效率，减少数据传输量，还是希望能够分成多个表单提交，所以这个办法暂不考虑。
是不是一定要用js或ajax？如果不用呢？
2 个人观点
1 用Ajax提交，比如prototype
new Ajax.Request();
你可以同时调用多个，默认是异步提交，所以可以同时提交多个表单，这个方案是最简单的。
2 使用多个iframe,然后将每个表单的target指向不同的iframe
然后用js的
document.getElementById("form1").submit();
document.getElementById("form2").submit();
。。。
这个样子进行提交。
3 两个方法的对比
Ajax方便简单，对结果的处理也比较省事，框架都替我们做好了，但不能跨域提交
iframe最符合一般的使用，也可以跨域提交，处理返回结果稍微麻烦些，需要在iframe里面使用 parent.进行调用才可以。
一般的需求是允许用户单独提交其中任何一个表单到下一个页面进行修改操作（也就是说页面有4个不同的修改按钮,点击哪个按钮则只提交某一个表单的数据到服务器，并根据表单的action）。
现在有这样的需求，允许用户选择其中任意的一个或多个表单进行提交修改，这样的话在客户端如何提交表单？
声明：可能会有人说将4个表单合成一个大表单，根据修改按钮的不同在服务器端进行不同的数据操作即可。这是一种解决办法，但考虑到页面数据量比较大，为了提高效率，减少数据传输量，还是希望能够分成多个表单提交，所以这个办法暂不考虑。
是不是一定要用js或ajax？如果不用呢？
2 个人观点
1 用Ajax提交，比如prototype
new Ajax.Request();
你可以同时调用多个，默认是异步提交，所以可以同时提交多个表单，这个方案是最简单的。
2 使用多个iframe,然后将每个表单的target指向不同的iframe
然后用js的
document.getElementById("form1").submit();
document.getElementById("form2").submit();
。。。
这个样子进行提交。
3 两个方法的对比
Ajax方便简单，对结果的处理也比较省事，框架都替我们做好了，但不能跨域提交
iframe最符合一般的使用，也可以跨域提交，处理返回结果稍微麻烦些，需要在iframe里面使用 parent.进行调用才可以。
相关文章
这篇文章主要介绍了JS实现多物体缓冲运动实例代码，有需要的朋友可以参考一下2013-11-11
今天小编就为大家分享一篇JS判断字符串是否为整数的方法--简单的正则判断，具有很好的参考价值，希望对大家有所帮助。一起跟随小编过来看看吧2018-07-07
这篇文章主要介绍了js将当前时间格式化为 年-月-日 时:分:秒主要是使用js的Date()对象，将系统当前时间格式化为年-月-日 时:分:秒，需要的朋友可以参考下2018-01-01
这篇文章主要介绍了JS简单验证上传文件类型的方法,涉及javascript文件遍历及字符串截取、匹配等相关操作技巧,需要的朋友可以参考下2017-04-04
如何利用Web Speech API之speechSynthesis实现文字转语音功能
Web Speech API使你能够将语音数据合并到Web应用程序中,SpeechSynthesisUtterance是HTML5中新增的API,用于将指定文字合成为对应的语音,这篇文章主要介绍了利用Web Speech API之speechSynthesis实现文字转语音功能,需要的朋友可以参考下2024-06-06
给大家图文详细分析一下jsonp的原理以及跨域问题的汇总。2017-11-11
下面小编就为大家带来一篇使用原生js写ajax实例(推荐)。小编觉得挺不错的，现在就分享给大家，也给大家做个参考。一起跟随小编过来看看吧2017-05-05
这篇文章主要为大家详细介绍了js+css打字效果的实现方法，文中示例代码介绍的非常详细，具有一定的参考价值，感兴趣的小伙伴们可以参考一下2018-04-04
这篇文章主要为大家详细介绍了原生JS音乐播放器，文中示例代码介绍的非常详细，具有一定的参考价值，感兴趣的小伙伴们可以参考一下2021-01-01
这篇文章主要介绍了详解微信小程序实现仿微信聊天界面(各种细节处理)，文中通过示例代码介绍的非常详细，对大家的学习或者工作具有一定的参考学习价值，需要的朋友们下面随着小编来一起学习学习吧2019-02-02
最新评论