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 相关文章推荐
jQuery解决iframe高度自适应代码
Dec 20 Javascript
javascript小组件 原生table排序表格脚本(兼容ie firefox opera chrome)
Jul 25 Javascript
JS实现可改变列宽的table实例
Jul 02 Javascript
javascript属性访问表达式用法分析
Apr 25 Javascript
jQuery获取及设置表单input各种类型值的方法小结
May 24 Javascript
jQuery滚动新闻实现代码
Jun 26 Javascript
详解Vue.js基于$.ajax获取数据并与组件的data绑定
May 26 Javascript
swiper插件自定义切换箭头按钮
Dec 28 Javascript
javascript填充默认头像方法
Feb 22 Javascript
JavaScript fetch接口案例解析
Aug 30 Javascript
小程序如何自主实现拦截器的示例代码
Nov 04 Javascript
如何实现js拖拽效果及原理解析
May 08 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
PHP 地址栏信息的获取代码
2009/01/07 PHP
php 中的4种标记风格介绍
2012/05/10 PHP
php中的Base62类(适用于数值转字符串)
2013/08/12 PHP
微信公众平台开发关注及取消关注事件的方法
2014/12/23 PHP
PHP+Ajax实现无刷新分页实例详解(附demo源码下载)
2016/04/07 PHP
thinkPHP js文件中U方法不被解析问题的解决方法
2016/12/05 PHP
php文件包含的几种方式总结
2019/09/19 PHP
用JavaScript 处理 URL 的两个函数代码
2007/08/13 Javascript
JS中引用百度地图并将百度地图的logo和信息去掉
2013/09/29 Javascript
js 获取、清空input type="file"的值示例代码
2014/02/19 Javascript
javascript event在FF和IE的兼容传参心得(绝对好用)
2014/07/10 Javascript
浅析Bootstrap组件之面板组件
2016/05/04 Javascript
angular ngClick阻止冒泡使用默认行为的方法
2016/11/03 Javascript
jQuery实现给input绑定回车事件的方法
2017/02/09 Javascript
详解vue 命名视图
2019/08/14 Javascript
[31:33]2014 DOTA2国际邀请赛中国区预选赛 TongFu VS DT 第一场
2014/05/23 DOTA
python多线程操作实例
2014/11/21 Python
python基于Tkinter库实现简单文本编辑器实例
2015/05/05 Python
Python:Scrapy框架中Item Pipeline组件使用详解
2017/12/27 Python
使用python接入微信聊天机器人
2020/03/31 Python
seek引发的python文件读写的问题及解决
2019/07/26 Python
python不同系统中打开方法
2020/06/23 Python
基于OpenCV的路面质量检测的实现
2020/11/04 Python
python 删除系统中的文件(按时间,大小,扩展名)
2020/11/19 Python
欧洲顶级的童装奢侈品购物网站:Bambini Fashion(面向全球)
2018/04/24 全球购物
播音主持女孩的自我评价分享
2013/11/20 职场文书
爱国主义教育活动总结
2014/05/07 职场文书
销售目标责任书
2014/07/23 职场文书
2014派出所所长群众路线对照检查材料思想汇报
2014/09/18 职场文书
大二学生自我检讨书
2014/10/23 职场文书
茶楼服务员岗位职责
2015/02/09 职场文书
学校运动会通讯稿
2015/07/18 职场文书
结婚纪念日感言
2015/08/01 职场文书
js实现自动锁屏功能
2021/06/02 Javascript
Nginx实现负载均衡的项目实践
2022/03/18 Servers
Win11跳过联网界面创建本地管理账户的3种方法
2022/04/20 数码科技