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 jQuery $.post $.ajax用法
Jul 09 Javascript
javascript脚本编程解决考试分数统计问题
Oct 18 Javascript
中国地区三级联动下拉菜单效果分析
Nov 15 Javascript
js实现字符串的16进制编码不加密
Apr 25 Javascript
jQuery寻找n以内完全数的方法
Jun 24 Javascript
jquery编写Tab选项卡滚动导航切换特效
Jul 17 Javascript
JS实现滑动门效果的方法详解
Dec 19 Javascript
JS实现改变HTML上文字颜色和内容的方法
Dec 30 Javascript
jQuery 控制文本框自动缩小字体填充
Jun 16 jQuery
webpack打包js的方法
Mar 12 Javascript
详解在React.js中使用PureComponent的重要性和使用方式
Jul 10 Javascript
nodemon实现Typescript项目热更新的示例代码
Nov 19 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中的时间处理
2006/10/09 PHP
收集的二十一个实用便利的PHP函数代码
2010/04/22 PHP
PHP访问MYSQL数据库封装类(附函数说明)
2010/12/04 PHP
PHP json格式和js json格式 js跨域调用实现代码
2012/09/08 PHP
利用yahoo汇率接口实现实时汇率转换示例 汇率转换器
2014/01/14 PHP
Joomla简单判断用户是否登录的方法
2016/05/04 PHP
laravel 事件/监听器实例代码
2019/04/12 PHP
Laravel 自带的Auth验证登录方法
2019/09/30 PHP
php+ajax实现文件切割上传功能示例
2020/03/03 PHP
SUN的《AJAX与J2EE》全文译了
2007/02/23 Javascript
jQuery Tools tooltip使用说明
2012/07/14 Javascript
jQuery自定义事件的简单实现代码
2014/01/27 Javascript
javascript中的altKey 和 Event属性大全
2015/11/06 Javascript
微信小程序后台解密用户数据实例详解
2017/06/28 Javascript
谈谈对vue响应式数据更新的误解
2017/08/01 Javascript
微信小程序实现slideUp、slideDown滑动效果及点击空白隐藏功能示例
2018/12/11 Javascript
vue 项目@change多个参数传值多个事件的操作
2021/01/29 Vue.js
[03:45]Newbee战队出征西雅图 决战2016国际邀请赛
2016/08/02 DOTA
Python实现删除当前目录下除当前脚本以外的文件和文件夹实例
2015/07/27 Python
pandas.DataFrame选取/排除特定行的方法
2018/07/03 Python
python 接口实现 供第三方调用的例子
2019/08/13 Python
Python+Tensorflow+CNN实现车牌识别的示例代码
2019/10/11 Python
CSS3实现线性渐变用法示例代码详解
2020/08/07 HTML / CSS
NFL加拿大官方网上商店:NHLShop.ca
2019/03/12 全球购物
Europcar比利时:租车
2019/08/26 全球购物
员工工作表扬信范文
2014/01/13 职场文书
财务主管岗位职责
2014/02/28 职场文书
征婚广告词
2014/03/17 职场文书
2014年基层党组织公开承诺书
2014/03/29 职场文书
求职信格式范文
2015/03/19 职场文书
2015年人力资源部工作总结
2015/04/30 职场文书
一个独生女的故事观后感
2015/06/04 职场文书
JavaScript与JQuery框架基础入门教程
2021/07/15 Javascript
golang操作redis的客户端包有多个比如redigo、go-redis
2022/04/14 Golang
vue封装数字翻牌器
2022/04/20 Vue.js
Java中Dijkstra(迪杰斯特拉)算法
2022/05/20 Java/Android