jquery动态改变form属性提交表单


Posted in Javascript onJune 03, 2014

有些情况下,同一个form在不同的情况下提交到不同的处理动作,可以在js中动态改变form的属性,满足不同条件的form提交需求。

如:

<form id="form" name="form" method="POST" enctype="multipart/form-data" action="action1.jsp" target="iframe"> 
<input type="file" name="file" id="file" class="input_text80"></input> 
<input id="name" name="name"/> 
<input type="button" value="更新到探测点" onClick="javascript:formSubmit();"></input> 
</form> 
<iframe name="iframe"></iframe>

现在需要条件1的情况下按上面的方式提交,以method="POST" enctype="multipart/form-data" action="action1.jsp" target="iframe"提交到action1.jsp进行处理;条件2的情况下需要按照普通文本方式提交到action2.jsp处理,并打开新页面。则需要通过js的方式动态改变form的属性:
function formSubmit(){ 
if(flag=="1"){ 
$("#form").submit(); 
}else if(flag=="2"){ 
$("#form").attr("action","deployResult.jsp"); 
$("#form").attr("target","_blank"); 
$("#form").attr("method","GET"); 
$("#form").attr("enctype","application/x-www-form-urlencoded"); 
$("#form").attr("encoding","application/x-www-form-urlencoded"); 
$("#form").submit(); 
} 
}

注:

改变form的enctype属性时,如果只写$("#form").attr("enctype","application/x-www-form-urlencoded");
将不起作用,必须将以下两句结合才能生效:

$("#form").attr("enctype","application/x-www-form-urlencoded"); 
$("#form").attr("encoding","application/x-www-form-urlencoded");

其中,enctype的属性值含义参考博文《HTML <form> 标签的 enctype 属性》
Javascript 相关文章推荐
JavaScript 异步调用框架 (Part 6 - 实例 &amp; 模式)
Aug 04 Javascript
js简单的弹出框有关闭按钮
May 05 Javascript
基于javascript的JSON格式页面展示美化方法
Jul 02 Javascript
深入剖析JavaScript编程中的对象概念
Oct 21 Javascript
js简单网速测试方法完整实例
Dec 15 Javascript
js实现浏览器倒计时跳转页面效果
Aug 12 Javascript
Javascript 详解封装from表单数据为json串进行ajax提交
Mar 29 Javascript
在JS中如何把毫秒转换成规定的日期时间格式实例
May 11 Javascript
EL表达式截取字符串的函数说明
Sep 22 Javascript
vue 组件中添加样式不生效的解决方法
Jul 06 Javascript
基于vue-cli 路由 实现类似tab切换效果(vue 2.0)
May 08 Javascript
详解如何在JS代码中消灭for循环
Dec 11 Javascript
javascript判断是手机还是电脑访问网页的简单实例分享
Jun 03 #Javascript
jQuery学习笔记之jQuery构建函数的7种方法
Jun 03 #Javascript
在myeclipse中如何加入jquery代码提示功能
Jun 03 #Javascript
jQuery学习笔记之总体架构
Jun 03 #Javascript
jquery控制select的text/value值为选中状态
Jun 03 #Javascript
Javascript中浮点数相乘的一个解决方法
Jun 03 #Javascript
js下将阿拉伯数字每三位一逗号分隔(如:15000000转化为15,000,000)
Jun 02 #Javascript
You might like
php中使用base HTTP验证的方法
2015/04/20 PHP
PHP mysqli事务操作常用方法分析
2017/07/22 PHP
yii2.0整合阿里云oss删除单个文件的方法
2017/09/19 PHP
PHP实现找出链表中环的入口节点
2018/01/16 PHP
PHP判断是否是微信打开,浏览器打开的方法
2018/03/14 PHP
javascript String 的扩展方法集合
2008/06/01 Javascript
写出更好的JavaScript之undefined篇(上)
2009/11/22 Javascript
javascript针对DOM的应用分析(二)
2012/04/15 Javascript
JavaScript 实现简单的倒计时弹窗DEMO附图
2014/03/05 Javascript
Eclipse编辑jsp、js文件时卡死现象的解决办法汇总
2016/02/02 Javascript
Node.js实用代码段之正确拼接Buffer
2016/03/17 Javascript
javascript中sort排序实例详解
2016/07/24 Javascript
Bootstrap幻灯片轮播图支持触屏左右手势滑动的实现方法
2016/10/13 Javascript
微信小程序 教程之事件
2016/10/18 Javascript
为Jquery EasyUI 组件加上清除功能的方法(详解)
2017/04/13 jQuery
Vue2.0设置全局样式(less/sass和css)
2017/11/18 Javascript
Vuex 在Vue 组件中获得Vuex 状态state的方法
2018/08/27 Javascript
html+jQuery实现拖动滑块图片拼图验证码插件【移动端适用】
2019/09/10 jQuery
Python下使用Psyco模块优化运行速度
2015/04/05 Python
Python ftp上传文件
2016/02/13 Python
Python中的命令行参数解析工具之docopt详解
2017/03/27 Python
用python 实现在不确定行数情况下多行输入方法
2019/01/28 Python
python sklearn库实现简单逻辑回归的实例代码
2019/07/01 Python
Python socket处理client连接过程解析
2020/03/18 Python
django的403/404/500错误自定义页面的配置方式
2020/05/21 Python
python中怎么表示空值
2020/06/19 Python
PyCharm中关于安装第三方包的三个建议
2020/09/17 Python
Python之字符串的遍历的4种方式
2020/12/08 Python
详解H5本地储存Web Storage
2017/07/03 HTML / CSS
解释下面关于J2EE的名词
2013/11/15 面试题
4s店市场专员岗位职责
2014/04/09 职场文书
情人节寄语大全
2014/04/11 职场文书
语文教育专业求职信
2014/06/28 职场文书
群众路线学习笔记范文
2014/11/06 职场文书
Python机器学习之逻辑回归
2021/05/11 Python
详解Spring Security中的HttpBasic登录验证模式
2022/03/17 Java/Android