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 相关文章推荐
js汉字转拼音实现代码
Feb 06 Javascript
在新窗口打开超链接的方法小结
Apr 14 Javascript
jQuery使用CSS()方法给指定元素同时设置多个样式
Mar 26 Javascript
javascript实现移动端上的触屏拖拽功能
Mar 04 Javascript
js实现简单的二级联动效果
Mar 09 Javascript
基于BootStrap的前端分页带省略号和上下页效果
May 18 Javascript
JS小球抛物线轨迹运动的两种实现方法详解
Dec 20 Javascript
详解vscode中vue代码颜色插件
Oct 11 Javascript
JavaScript学习笔记之DOM操作实例分析
Jan 08 Javascript
Node使用Nodemailer发送邮件的方法实现
Feb 24 Javascript
详解JavaScript作用域、作用域链和闭包的用法
Sep 03 Javascript
vue中路由跳转不计入history的操作
Sep 21 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 中的str_replace 函数总结
2007/04/27 PHP
深入浅出php socket编程
2015/05/13 PHP
js点击页面其它地方将某个显示的DIV隐藏
2012/07/12 Javascript
JavaScript判断DOM何时加载完毕的技巧
2012/11/11 Javascript
JavaScript 消息框效果【实现代码】
2016/04/27 Javascript
20分钟成功编写bootstrap响应式页面 就这么简单
2016/05/12 Javascript
jQuery Ajax使用FormData对象上传文件的方法
2016/09/07 Javascript
网站发布后Bootstrap框架引用woff字体无法正常显示的解决方法
2016/11/24 Javascript
基于vue-ssr服务端渲染入门详解
2018/01/08 Javascript
详解JS实现系统登录页的登录和验证
2019/04/29 Javascript
JavaScript中的各种宽高属性的实现
2020/05/08 Javascript
原生js实现五子棋游戏
2020/05/28 Javascript
详解React 元素渲染
2020/07/07 Javascript
js实现复制粘贴的两种方法
2020/12/04 Javascript
javascript代码实现简易计算器
2021/01/25 Javascript
python3实现读取chrome浏览器cookie
2016/06/19 Python
Python使用defaultdict读取文件各列的方法
2017/05/11 Python
Python基于xlrd模块操作Excel的方法示例
2018/06/21 Python
详解Django+Uwsgi+Nginx的生产环境部署
2018/06/25 Python
使用pandas read_table读取csv文件的方法
2018/07/04 Python
pyqt弹出新对话框,以及关闭对话框获取数据的实例
2019/06/18 Python
Python高并发解决方案实现过程详解
2020/07/31 Python
Python操作Excel的学习笔记
2021/02/18 Python
数以千计的折扣工业产品:ESE Direct
2018/05/20 全球购物
芬兰设计商店美国:Finnish Design Shop US
2019/03/25 全球购物
大学学年自我鉴定
2013/10/28 职场文书
经理秘书找工作求职信
2013/12/19 职场文书
英语专业毕业生自荐信范文
2013/12/31 职场文书
教师党员思想汇报
2014/01/06 职场文书
会计电算化学生个人的自我评价
2014/02/08 职场文书
做人民满意的公务员活动方案
2014/08/25 职场文书
音乐之声音乐广播稿
2014/09/10 职场文书
大学生见习期满自我鉴定
2014/09/13 职场文书
史上最牛的辞职信
2015/02/28 职场文书
Java SSH 秘钥连接mysql数据库的方法
2021/06/28 Java/Android
mysql序号rownum行号实现方式
2022/12/24 MySQL