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操作xml
Nov 04 Javascript
javascript indexOf函数使用说明
Jul 03 Javascript
jQuery '行 4954 错误: 不支持该属性或方法' 的问题解决方法
Jan 19 Javascript
使用Mootools动态添加Css样式表代码,兼容各浏览器
Dec 12 Javascript
使用jQuery实现的掷色子游戏动画效果
Mar 14 Javascript
使用JQuery选择HTML遍历函数的方法
Sep 17 Javascript
微信小程序 点击控件后选中其它反选实例详解
Feb 21 Javascript
解决浏览器会自动填充密码的问题
Apr 28 Javascript
vue mint-ui 实现省市区街道4级联动示例(仿淘宝京东收货地址4级联动)
Oct 16 Javascript
微信小程序出现wx.navigateTo页面不跳转问题的解决方法
Dec 26 Javascript
extjs图表绘制之条形图实现方法分析
Mar 06 Javascript
微信小程序实现菜单左右联动
May 19 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
thinkphp实现数组分页示例
2014/04/13 PHP
Codeigniter实现多文件上传并创建多个缩略图
2014/06/12 PHP
PHP访问数据库集群的方法小结
2016/03/14 PHP
PDO::query讲解
2019/01/29 PHP
PHP通过文件保存和更新信息的方法分析
2019/09/12 PHP
javascript 年月日联动实现核心代码
2009/12/21 Javascript
javascript中直接引用Microsoft的COM生成Word
2014/01/20 Javascript
jquery制作搜狐快站页面效果示例分享
2014/02/21 Javascript
Javascript快速排序算法详解
2014/12/03 Javascript
JavaScript闭包详解
2015/02/02 Javascript
jQuery实现行文字链接提示效果的方法
2015/03/10 Javascript
NodeJS和BootStrap分页效果的实现代码
2016/11/07 NodeJs
微信小程序中使用ECharts 异步加载数据的方法
2018/06/27 Javascript
详解vue+webpack+express中间件接口使用
2018/07/17 Javascript
Node.js Koa2使用JWT进行鉴权的方法示例
2018/08/17 Javascript
简单实现vue中的依赖收集与响应的方法
2019/02/18 Javascript
vue跳转方式(打开新页面)及传参操作示例
2020/01/26 Javascript
JS+CSS实现炫酷光感效果
2020/09/05 Javascript
Python六大开源框架对比
2015/10/19 Python
教你学会使用Python正则表达式
2017/09/07 Python
从运行效率与开发效率比较Python和C++
2018/12/14 Python
用Python实现二叉树、二叉树非递归遍历及绘制的例子
2019/08/09 Python
基于python plotly交互式图表大全
2019/12/07 Python
python获取网络图片方法及整理过程详解
2019/12/20 Python
Python第三方包之DingDingBot钉钉机器人
2020/04/09 Python
Python命令行参数argv和argparse该如何使用
2021/02/08 Python
使用CSS3来匹配横屏竖屏的简单方法
2015/08/04 HTML / CSS
英国经典球衣网站:Classic Football Shirts
2017/05/20 全球购物
NARS化妆品官方商店:美国彩妆品牌
2017/08/26 全球购物
美国著名手表网站:Timepiece
2017/11/15 全球购物
租租车:国际租车、美国租车、欧洲租车、特价预订国外租车(中文服务)
2018/03/28 全球购物
介绍一下Ruby的特点
2013/01/20 面试题
电子商务网站的创业计划书
2014/01/05 职场文书
小区环境卫生倡议书
2015/04/29 职场文书
学雷锋广播稿大全
2015/08/19 职场文书
java多态注意项小结
2021/10/16 Java/Android