使用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 相关文章推荐
学习面向对象之面向对象的术语
Nov 30 Javascript
JavaScript给url网址进行encode编码的方法
Mar 18 Javascript
JS实现兼容各浏览器解析XML文档数据的方法
Jun 01 Javascript
javascript伸缩菜单栏实现代码分享
Nov 12 Javascript
Javascript循环删除数组中元素的几种方法示例
May 18 Javascript
js分页之前端代码实现和请求处理
Aug 04 Javascript
JS实现json对象数组按对象属性排序操作示例
May 18 Javascript
浅析Vue 生命周期
Jun 21 Javascript
vue this.reload 方法 配置
Sep 12 Javascript
vue中el-upload上传图片到七牛的示例代码
Oct 19 Javascript
小程序实现五星点评效果
Nov 03 Javascript
javascript数组includes、reduce的基本使用
Jul 02 Javascript
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
flash用php连接数据库的代码
2011/04/21 PHP
使用PHP实现二分查找算法代码分享
2011/06/24 PHP
thinkPHP中钩子的两种配置调用方法详解
2016/11/11 PHP
PHP中Static(静态)关键字功能与用法实例分析
2019/04/05 PHP
详谈 Jquery Ajax异步处理Json数据.
2011/09/09 Javascript
基于JQuery实现的Select级联
2014/01/27 Javascript
Web表单提交之disabled问题js解决方法
2015/01/13 Javascript
jQuery插件datalist实现很好看的input下拉列表
2015/07/14 Javascript
jQuery插件简单实现方法
2015/07/18 Javascript
js行号显示的文本框实现效果(兼容多种浏览器 )
2015/10/23 Javascript
JS动态给对象添加属性和值的实现方法
2016/10/21 Javascript
AngularJS 使用ng-repeat报错 [ngRepeat:dupes]
2017/01/19 Javascript
jQuery Position方法使用和兼容性
2017/08/23 jQuery
小程序图片剪裁加旋转的示例代码
2018/07/10 Javascript
jQuery列表动态增加和删除的实现方法
2020/11/05 jQuery
vue中activated的用法
2021/01/03 Vue.js
[02:42]DOTA2英雄基础教程 杰奇洛
2013/12/23 DOTA
[01:29:42]Liquid vs VP Supermajor决赛 BO 第一场 6.10
2018/07/05 DOTA
Python语言实现将图片转化为html页面
2017/12/06 Python
pandas 对series和dataframe进行排序的实例
2018/06/09 Python
python3实现点餐系统
2019/01/24 Python
Python List cmp()知识点总结
2019/02/18 Python
Tensorflow 卷积的梯度反向传播过程
2020/02/10 Python
Django自定义全局403、404、500错误页面的示例代码
2020/03/08 Python
python字典key不能是可以是啥类型
2020/08/04 Python
HTML5 语义化结构化规范化
2008/10/17 HTML / CSS
YOINS官网:时尚女装网上购物
2017/03/17 全球购物
医务人员竞聘职务自我评价分享
2013/11/08 职场文书
委托书格式
2014/08/01 职场文书
夫妻双方自愿离婚协议书怎么写
2014/12/01 职场文书
故宫导游词
2015/01/31 职场文书
2019员工保密协议书(3篇)
2019/09/23 职场文书
Python中Permission denied的解决方案
2021/04/02 Python
Python中json.dumps()函数的使用解析
2021/05/17 Python
恶魔之树最顶端的三颗果实 震震果实上榜,第一可以制造岩浆
2022/03/18 日漫
vue中的可拖拽宽度div的实现示例
2022/04/08 Vue.js