使用jquery修改表单的提交地址基本思路


Posted in Javascript onJune 04, 2014

基本思路:

通过使用jquery选择器得到对应表单的jquery对象,然后使用attr方法修改对应的action

示例程序一:

默认情况下,该表单会提交到page_one.html

点击button之后,表单的提交地址就会修改为page_two.html

<!doctype html> 
<html> 
<head> 
<meta charset="utf-8"> 
<title>jquery test</title> 
<script src="jquery-1.11.1.min.js"></script> 
</head> <body> 
<div> 
<form action="page_one.html" id="qianshou"> 
<input type="text"/> 
<input type="submit" value="提 交"/> 
</form> 
</div> 
<div> 
<button name="update">修改form的提交地址为page_two.html</button> 
</div> 
</body> 
<script> 
var $fun = $('button[name=update]'); 
$fun.click(function(){ 
$('form[id=qianshou]').attr('action','page_two.html'); 
}); 
</script> 
</html>

示例程序二:

form本来的action地址是page_one.html,通过jquery直接修改为page_two.html

<!doctype html> 
<html> 
<head> 
<meta charset="utf-8"> 
<title>jquery test</title> 
<script src="jquery-1.11.1.min.js"></script> 
</head> <body> 
<div> 
<form action="page_one.html" id="qianshou"> 
<input type="text"/> 
<input type="submit" value="提 交"/> 
</form> 
</div> 
</body> 
<script> 
$('form[id=qianshou]').attr('action','page_two.html'); 
</script> 
</html>
Javascript 相关文章推荐
自定义右键属性覆盖浏览器默认右键行为实现代码
Feb 02 Javascript
js写的评论分页(还不错)
Dec 23 Javascript
解决Jquery鼠标经过不停滑动的问题
Mar 03 Javascript
JavaScript将取代AppleScript?
Sep 18 Javascript
基于jQuery实现动态搜索显示功能
May 05 Javascript
什么是JavaScript中的结果值?
Oct 08 Javascript
微信小程序 五星评价功能的实现
Mar 09 Javascript
JavaScript通过filereader接口读取文件
May 10 Javascript
获取layer.open弹出层的返回值方法
Aug 20 Javascript
微信小程序实现的canvas合成图片功能示例
May 03 Javascript
解决layui下拉框监听问题(监听不到值的变化)
Sep 28 Javascript
Vue 集成 PDF.js 实现 PDF 预览和添加水印的步骤
Jan 22 Vue.js
jQuery操作元素css样式的三种方法
Jun 04 #Javascript
跟我学Node.js(四)---Node.js的模块载入方式与机制
Jun 04 #Javascript
使用GruntJS构建Web程序之构建篇
Jun 04 #Javascript
使用GruntJS构建Web程序之安装篇
Jun 04 #Javascript
jQuery 隐藏和显示 input 默认值示例
Jun 03 #Javascript
动态读取JSON解析键值对的方法
Jun 03 #Javascript
js、jquery图片动画、动态切换示例代码
Jun 03 #Javascript
You might like
用PHP实现Ftp用户的在线管理
2012/02/16 PHP
thinkphp项目部署到Linux服务器上报错“模板不存在”如何解决
2016/04/27 PHP
EditPlus注册码生成器(js代码实现)
2013/03/25 Javascript
JavaScript中String.match()方法的使用详解
2015/06/06 Javascript
jQuery插件datepicker 日期连续选择
2015/06/12 Javascript
JavaScript函数内部属性和函数方法实例详解
2016/03/17 Javascript
利用js编写响应式侧边栏
2016/09/17 Javascript
基于jQuery的左滑出现删除按钮的示例
2017/08/29 jQuery
Web开发使用Angular实现用户密码强度判别的方法
2017/09/27 Javascript
JavaScript继承定义与用法实践分析
2018/05/28 Javascript
vue-cli3.0 环境变量与模式配置方法
2018/11/08 Javascript
使用vue完成微信公众号网页小记(推荐)
2019/04/28 Javascript
AngularJS实现的鼠标拖动画矩形框示例【可兼容IE8】
2019/05/17 Javascript
laravel-admin 与 vue 结合使用实例代码详解
2019/06/04 Javascript
小程序组件之自定义顶部导航实例
2019/06/12 Javascript
layui自定义插件citySelect实现省市区三级联动选择
2019/07/26 Javascript
JS代码优化的8点建议
2020/02/04 Javascript
vue自定义插件封装,实现简易的elementUi的Message和MessageBox的示例
2020/11/20 Vue.js
vue的hash值原理也是table切换实例代码
2020/12/14 Vue.js
[01:03:27]NAVI vs EG 2019国际邀请赛小组赛 BO2 第一场 8.15
2019/08/17 DOTA
python K近邻算法的kd树实现
2018/09/06 Python
python实现植物大战僵尸游戏实例代码
2019/06/10 Python
pytorch torch.expand和torch.repeat的区别详解
2019/11/05 Python
python GUI库图形界面开发之PyQt5访问系统剪切板QClipboard类详细使用方法与实例
2020/02/27 Python
HTML5实现应用程序缓存(Application Cache)
2020/06/16 HTML / CSS
中东最大的在线宠物店:Dubai Pet Food
2020/06/11 全球购物
写好自荐信的要点
2013/11/06 职场文书
建材业务员岗位职责
2013/12/08 职场文书
高一生物教学反思
2014/01/17 职场文书
会计电算化应届生自荐信
2014/02/25 职场文书
会计与出纳自荐书范文
2014/03/16 职场文书
优秀团员自我评价范文
2014/04/23 职场文书
文案策划专业自荐信
2014/07/07 职场文书
2014年大学生村官工作总结
2014/11/19 职场文书
伏羲庙导游词
2015/02/09 职场文书
GTX1650super好不好 gtx1650super显卡属于什么级别
2022/04/08 数码科技