用Javascript同时提交多个Web表单的方法


Posted in Javascript onDecember 26, 2009

1问题来自一位网友的提问:
web页面里有多个表单,每个表单对应着某一类数据操作。
比如一个详细的简历信息页面分
1、个人资料
2、工作经验
3、项目经验
4、其他信息 4个表单。
一般的需求是允许用户单独提交其中任何一个表单到下一个页面进行修改操作(也就是说页面有4个不同的修改按钮,点击哪个按钮则只提交某一个表单的数据到服务器,并根据表单的action)。
现在有这样的需求,允许用户选择其中任意的一个或多个表单进行提交修改,这样的话在客户端如何提交表单?
声明:可能会有人说将4个表单合成一个大表单,根据修改按钮的不同在服务器端进行不同的数据操作即可。这是一种解决办法,但考虑到页面数据量比较大,为了提高效率,减少数据传输量,还是希望能够分成多个表单提交,所以这个办法暂不考虑。是不是一定要用js或ajax?如果不用呢?

2 个人观点
1 用Ajax提交,比如prototype
new Ajax.Request("/do1",{parameters:$("form1").serialize().......);

new Ajax.Request("/do2",{parameters:$("form2").serialize().......);

你可以同时调用多个,默认是异步提交,所以可以同时提交多个表单,这个方案是最简单的。

2 使用多个iframe,然后将每个表单的target指向不同的iframe
然后用js的
document.getElementById("form1").submit();
document.getElementById("form2").submit();
。。。
这个样子进行提交。

3 两个方法的对比
Ajax方便简单,对结果的处理也比较省事,框架都替我们做好了,但不能跨域提交
iframe最符合一般的使用,也可以跨域提交,处理返回结果稍微麻烦些,需要在iframe里面使用 parent.进行调用才可以。

Javascript 相关文章推荐
再谈IE中Flash控件的自动激活 ObjectWrap
Mar 09 Javascript
六款帮助你实现惊艳视差滚动效果的jQuery插件
Sep 14 Javascript
javaScript函数中执行C#代码中的函数方法总结
Aug 07 Javascript
浅谈jQuery异步对象(XMLHttpRequest)
Nov 17 Javascript
JS实用的动画弹出层效果实例
May 05 Javascript
JavaScript从0开始构思表情插件
Jul 26 Javascript
Vue.js简易安装和快速入门(第二课)
Oct 17 Javascript
jQuery使用动画队列自定义动画操作示例
Jun 16 jQuery
JS面试题大坑之隐式类型转换实例代码
Oct 14 Javascript
详解vue中router-link标签所必备了解的属性
Apr 15 Javascript
element-ui table行点击获取行索引(index)并利用索引更换行顺序
Feb 27 Javascript
JavaScript获取URL参数的方法分享
Apr 07 Javascript
再谈javascript 动态添加样式规则 W3C校检
Dec 25 #Javascript
javascript 处理事件绑定的一些兼容写法
Dec 24 #Javascript
Javascript 键盘keyCode键码值表
Dec 24 #Javascript
JQuery与iframe交互实现代码
Dec 24 #Javascript
jquery 弹出登录窗口实现代码
Dec 24 #Javascript
Jquery 高亮显示文本中重要的关键字
Dec 24 #Javascript
JQuery 写的个性导航菜单
Dec 24 #Javascript
You might like
PHP中将网页导出为Word文档的代码
2012/05/25 PHP
php基于base64解码图片与加密图片还原实例
2014/11/03 PHP
PHP中UNIX时间戳和日期间的转换与计算实例
2014/11/19 PHP
php集成套件服务器xampp安装使用教程(适合第一次玩PHP的新手)
2015/06/03 PHP
浅谈PHP中foreach/in_array的使用
2015/11/02 PHP
thinkPHP5框架实现多数据库连接,跨数据连接查询操作示例
2019/05/29 PHP
PHP判断当前使用的是什么浏览器(推荐)
2019/10/27 PHP
ArrayList类(增强版)
2007/04/04 Javascript
JavaScript字符串String和Array操作的有趣方法
2012/12/18 Javascript
window.location.reload()方法刷新页面弹出要再次显示该网页对话框
2013/04/24 Javascript
比较不错的JS/JQuery显示或隐藏文本的方法
2014/02/13 Javascript
常用的JavaScript WEB操作方法分享
2015/02/28 Javascript
js图片切换具体实现代码
2016/10/13 Javascript
js清除浏览器缓存的几种方法
2017/03/15 Javascript
微信小程序如何获取用户信息
2018/01/26 Javascript
koa socket即时通讯的示例代码
2018/09/07 Javascript
微信小程序仿知乎实现评论留言功能
2018/11/28 Javascript
微信小程序textarea层级过高(盖住其他元素)问题的解决办法
2019/03/04 Javascript
vuex vue简单使用知识点总结
2019/08/29 Javascript
[49:08]OpTic vs Serenity 2018国际邀请赛小组赛BO2 第一场 8.18
2018/08/19 DOTA
Python中使用动态变量名的方法
2014/05/06 Python
Python PyQt5标准对话框用法示例
2017/08/23 Python
Python中的默认参数实例分析
2018/01/29 Python
Python字符串的全排列算法实例详解
2019/01/07 Python
浅谈Keras中shuffle和validation_split的顺序
2020/06/19 Python
详解python metaclass(元类)
2020/08/13 Python
lookfantastic荷兰:在线购买奢华护肤、护发和化妆品
2018/11/27 全球购物
如何利用cmp命令比较文件
2016/04/11 面试题
财务主管自我鉴定
2014/01/17 职场文书
田径运动会开幕式及主持词
2014/03/28 职场文书
白莲教口号
2014/06/18 职场文书
领导班子三严三实对照检查材料
2014/09/25 职场文书
社保缴纳证明申请书
2014/11/03 职场文书
2014年政协委员工作总结
2014/12/01 职场文书
运动员代表致辞
2015/07/29 职场文书
Python 绘制多因子柱状图
2022/05/11 Python