用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 相关文章推荐
js+css在交互上的应用
Jul 18 Javascript
前端开发的开始---基于面向对象的Ajax类
Sep 17 Javascript
javascript中定义类的方法详解
Feb 10 Javascript
用JavaScript来美化HTML的select标签的下拉列表效果
Nov 17 Javascript
JS中frameset框架弹出层实例代码
Apr 01 Javascript
jquery自适应布局的简单实例
May 28 Javascript
jQuery除指定区域外点击任何地方隐藏DIV功能
Nov 13 jQuery
jquery实现动态添加附件功能
Oct 23 jQuery
JS获取当前时间的实例代码(昨天、今天、明天)
Nov 13 Javascript
uni-app实现点赞评论功能
Nov 25 Javascript
详解JavaScript数据类型和判断方法
Sep 04 Javascript
Vue 解决在element中使用$notify在提示信息中换行问题
Nov 11 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下MYSQL limit的优化
2008/01/10 PHP
php 空格,换行,跳格使用说明
2009/12/18 PHP
php笔记之:AOP的应用
2013/04/24 PHP
PHP中ini_set和ini_get函数的用法小结
2014/02/18 PHP
php数组查找函数in_array()、array_search()、array_key_exists()使用实例
2014/04/29 PHP
php采用file_get_contents代替使用curl实例
2014/11/07 PHP
使用JQuery进行跨域请求
2010/01/25 Javascript
jquery 得到当前页面高度和宽度的两个函数
2010/02/21 Javascript
js实现从数组里随机获取元素
2015/01/12 Javascript
PHP实现的各种中文编码转换类分享
2015/01/23 Javascript
jquery实现九宫格大转盘抽奖
2015/11/13 Javascript
复杂的javascript窗口分帧解析
2016/02/19 Javascript
AngularJS利用Controller完成URL跳转
2016/08/09 Javascript
解决浏览器会自动填充密码的问题
2017/04/28 Javascript
纯JS实现出生日期[年月日]下拉菜单效果
2018/06/01 Javascript
微信小程序解除10个请求并发限制
2018/12/18 Javascript
jquery的$().each和$.each的区别
2019/01/18 jQuery
微信小程序表单验证WxValidate的使用
2019/11/27 Javascript
详解JSON.stringify()的5个秘密特性
2020/05/26 Javascript
[02:23]DOTA2英雄基础教程 幻影长矛手
2013/12/09 DOTA
[01:05]DOTA2完美大师赛趣味视频之选手教你打职业
2017/11/23 DOTA
[51:20]完美世界DOTA2联赛PWL S2 Magma vs PXG 第一场 11.28
2020/12/01 DOTA
在Python中使用HTML模版的教程
2015/04/29 Python
50行Python代码实现人脸检测功能
2018/01/23 Python
Python实现html转换为pdf报告(生成pdf报告)功能示例
2019/05/04 Python
解决pytorch GPU 计算过程中出现内存耗尽的问题
2019/08/19 Python
使用python turtle画高达
2020/01/19 Python
安装Anaconda3及使用Jupyter的方法
2020/10/27 Python
英国鞋类及配饰零售商:Kurt Geiger
2017/02/04 全球购物
欧洲著名的二手奢侈品网站:Vestiaire Collective
2020/03/07 全球购物
高校生生产实习自我鉴定
2013/09/21 职场文书
婚礼证婚人证婚词
2014/01/08 职场文书
关于元旦的广播稿
2014/02/16 职场文书
师范教师专业大学生职业生涯规划范文
2014/03/02 职场文书
驳回起诉民事裁定书
2015/05/19 职场文书
python使用openpyxl库读写Excel表格的方法(增删改查操作)
2021/05/02 Python