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


Posted in Javascript onFebruary 19, 2009

比如一个详细的简历信息页面分 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.进行调用才可以。

Javascript 相关文章推荐
别了 JavaScript中的isXX系列
Aug 01 Javascript
JAVASCRIPT模式窗口中下载文件无法接收iframe的流
Oct 11 Javascript
javascript if条件判断方法小结
May 17 Javascript
基于jQuery实现的文字按钮表单特效整理
Dec 07 Javascript
jQuery点缩略图弹出层显示大图片
Feb 13 Javascript
基于jquery实现页面滚动时顶部导航显示隐藏
Apr 20 Javascript
浏览器环境下JavaScript脚本加载与执行探析之动态脚本与Ajax脚本注入
Jan 19 Javascript
30分钟快速掌握Bootstrap框架
May 24 Javascript
全面解析Bootstrap中form、navbar的使用方法
May 30 Javascript
Javascript DOM事件操作小结(监听鼠标点击、释放,悬停、离开等)
Jan 20 Javascript
JS代码优化的8点建议
Feb 04 Javascript
前端性能优化建议
Sep 17 Javascript
javascript function、指针及内置对象
Feb 19 #Javascript
csdn 批量接受好友邀请
Feb 19 #Javascript
判断多个元素(RADIO,CHECKBOX等)是否被选择的原理说明
Feb 18 #Javascript
JAVASCRIPT IE 与 FF中兼容问题小结
Feb 18 #Javascript
javascript css在IE和Firefox中区别分析
Feb 18 #Javascript
js表数据排序 sort table data
Feb 18 #Javascript
js window.event对象详尽解析
Feb 17 #Javascript
You might like
简单解决新浪SAE无法上传文件的问题
2015/05/13 PHP
javascript中字符串拼接需注意的问题
2010/07/13 Javascript
document.getElementById获取控件对象为空的解决方法
2013/11/20 Javascript
jQuery Mobile的loading对话框显示/隐藏方法分享
2013/11/26 Javascript
深入分析js的冒泡事件
2014/12/05 Javascript
ECMAScript6新增值比较函数Object.is
2015/06/12 Javascript
javascript日期计算实例分析
2015/06/29 Javascript
基于jQuery实现仿百度首页换肤背景图片切换代码
2015/08/25 Javascript
第一篇初识bootstrap
2016/06/21 Javascript
jQuery 3.0 的 setter和getter 模式详解
2016/07/11 Javascript
Node.js读写文件之批量替换图片的实现方法
2016/09/07 Javascript
Ionic 2 实现列表滑动删除按钮的方法
2017/01/22 Javascript
基于JavaScript实现幸运抽奖页面
2020/07/05 Javascript
js+canvas实现验证码功能
2020/09/21 Javascript
bootstrap下拉分页样式 带跳转页码
2018/12/29 Javascript
JavaScript Window浏览器对象模型原理解析
2020/05/30 Javascript
vue 动态添加class,三个以上的条件做判断方式
2020/11/02 Javascript
[01:01:41]DOTA2-DPC中国联赛 正赛 PSG.LGD vs Magma BO3 第二场 1月31日
2021/03/11 DOTA
使用Python编写简单网络爬虫抓取视频下载资源
2014/11/04 Python
python使用Queue在多个子进程间交换数据的方法
2015/04/18 Python
简单谈谈Python中的几种常见的数据类型
2017/02/10 Python
windows下python安装小白入门教程
2018/09/18 Python
python3 unicode列表转换为中文的实例
2018/10/26 Python
对python制作自己的数据集实例讲解
2018/12/12 Python
Python3多目标赋值及共享引用注意事项
2019/05/27 Python
用Python绘制漫步图实例讲解
2020/02/26 Python
Python 改变数组类型为uint8的实现
2020/04/09 Python
python中JWT用户认证的实现
2020/05/18 Python
python中rb含义理解
2020/06/18 Python
巴西男士个人护理产品商店:SHOP4MEN
2017/08/07 全球购物
高性能装备提升营地:Kammok
2019/02/27 全球购物
婚鞋、新娘鞋、礼服鞋、童鞋:Nina Shoes
2019/09/04 全球购物
德国专业木制品经销商:Holz-Direkt24
2019/12/26 全球购物
新闻学专业应届生求职信
2013/11/08 职场文书
使用python+pygame开发消消乐游戏附完整源码
2021/06/10 Python
php双向队列实例讲解
2021/11/17 PHP