用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 缓存策略的BUG的解决方法
Jul 21 Javascript
用js来定义浏览器中一个左右浮动元素相对于页面主体宽度的位置的函数
Jan 21 Javascript
JS.GetAllChild(element,deep,condition)使用介绍
Sep 21 Javascript
JSON.parse()和JSON.stringify()使用介绍
Jun 20 Javascript
JavaScript解析json格式数据简单示例
Dec 09 Javascript
直接拿来用的页面跳转进度条JS实现
Jan 06 Javascript
提升jQuery的性能需要做好七件事
Jan 11 Javascript
jQuery操作iframe中js函数的方法小结
Jul 06 Javascript
基于jQuery的$.getScript方法去加载javaScript文档解析
Nov 08 jQuery
如何在Vue.js中实现标签页组件详解
Jan 02 Javascript
BootStrap表单验证中的非Submit类型按钮点击时触发验证的坑
Sep 05 Javascript
Javascript类型判断相关例题及解析
Aug 26 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安装问题
2006/10/09 PHP
php下批量挂马和批量清马代码
2011/02/27 PHP
PHP封装的PDO数据库操作类实例
2017/06/21 PHP
基于jquery的模态div层弹出效果
2010/08/21 Javascript
javascript学习笔记(六) Date 日期类型
2012/06/19 Javascript
javascript如何实现暂停功能
2015/11/06 Javascript
JavaScript实现输入框(密码框)出现提示语
2016/01/12 Javascript
基于jQuery倒计时插件实现团购秒杀效果
2016/05/13 Javascript
jquery过滤特殊字符',防sql注入的实现方法
2016/08/17 Javascript
JS添加或修改控件的样式(Class)实现方法
2016/10/15 Javascript
微信小程序-消息提示框实例
2016/11/24 Javascript
浅谈jquery采用attr修改form表单enctype不起作用的问题
2016/11/25 Javascript
基于js中document.cookie全面解析
2017/09/14 Javascript
Python中使用PyHook监听鼠标和键盘事件实例
2014/07/18 Python
Python中list列表的一些进阶使用方法介绍
2015/08/15 Python
Python实现八大排序算法
2016/08/13 Python
Python双精度浮点数运算并分行显示操作示例
2017/07/21 Python
Python实现抢购IPhone手机
2018/02/07 Python
解决Python pandas df 写入excel 出现的问题
2018/07/04 Python
Python数据结构之栈、队列及二叉树定义与用法浅析
2018/12/27 Python
基于python实现百度翻译功能
2019/05/09 Python
python pytest进阶之conftest.py详解
2019/06/27 Python
超简单的Python HTTP服务
2019/07/22 Python
Pytorch中index_select() 函数的实现理解
2019/11/19 Python
Pytorch数据拼接与拆分操作实现图解
2020/04/30 Python
Python常用外部指令执行代码实例
2020/11/05 Python
安装不同版本的tensorflow与models方法实现
2021/02/20 Python
使用CSS3制作响应式导航菜单的方法
2015/07/12 HTML / CSS
使用CSS3来实现滚动视差效果的教程
2015/08/24 HTML / CSS
EJB包括(SessionBean,EntityBean)说出他们的生命周期,及如何管理事务的
2015/07/24 面试题
数控专业个人求职信范文
2014/02/05 职场文书
爱祖国爱家乡演讲稿
2014/09/02 职场文书
企业办公室主任岗位职责
2015/04/01 职场文书
民政局2016年“六一”儿童节慰问活动总结
2016/04/06 职场文书
2019终止劳动合同协议书最新范本!
2019/07/09 职场文书
python绘制简单直方图(质量分布图)的方法
2022/04/21 Python