使用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 相关文章推荐
Jquery+JSon 无刷新分页实现代码
Apr 01 Javascript
深入理解javascript动态插入技术
Nov 12 Javascript
ExtJs中gridpanel分组后组名排序实例代码
Dec 02 Javascript
jQuery中queue()方法用法实例
Dec 29 Javascript
javascript简单实现滑动菜单效果的方法
Jul 27 Javascript
jquery实现的Accordion折叠面板效果代码
Sep 02 Javascript
Javascript设计模式理论与编程实战之简单工厂模式
Nov 03 Javascript
JQuery动态添加Select的Option元素实现方法
Aug 29 Javascript
JS实现表单验证功能(验证手机号是否存在,验证码倒计时)
Oct 11 Javascript
AjaxUpLoad.js实现文件上传
Mar 05 Javascript
使用pkg打包Node.js应用的方法步骤
Oct 19 Javascript
JS尾递归的实现方法及代码优化技巧
Jan 19 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
php !function_exists(&quot;T7FC56270E7A70FA81A5935B72EACBE29&quot;))代码解密
2011/01/07 PHP
深入理解:单一入口、MVC、ORM、CURD、ActiveRecord概念
2013/06/06 PHP
php检测用户是否用手机(Mobile)访问网站的类
2014/01/09 PHP
PHP比你想象的好得多
2014/11/27 PHP
php计划任务之ignore_user_abort函数实现方法
2015/01/08 PHP
Laravel5.7 Eloquent ORM快速入门详解
2019/04/12 PHP
php 下 html5 XHR2 + FormData + File API 上传文件操作实例分析
2020/02/28 PHP
window.addeventjs事件驱动函数集合addEvent等
2008/02/19 Javascript
Html中JS脚本执行顺序简单举例说明
2010/06/19 Javascript
使用jQuery内容过滤选择器选择元素实例讲解
2013/04/18 Javascript
jquery教程限制文本框只能输入数字和小数点示例分享
2014/01/13 Javascript
JavaScript中实现异步编程模式的4种方法
2014/09/24 Javascript
javascript制作网页图片上实现下雨效果
2015/02/26 Javascript
JS弹出对话框实现方法(三种方式)
2015/12/18 Javascript
JavaScript function函数种类详解
2016/02/22 Javascript
基于Bootstrap重置输入框内容按钮插件
2016/05/12 Javascript
Javascript单例模式的介绍和实例
2016/10/08 Javascript
js中的事件委托或是事件代理使用详解
2017/06/23 Javascript
React如何利用相对于根目录进行引用组件详解
2017/10/09 Javascript
express express-session的使用小结
2018/12/12 Javascript
Vue 实现前进刷新后退不刷新的效果
2019/06/14 Javascript
Python中多线程thread与threading的实现方法
2014/08/18 Python
python2.7无法使用pip的解决方法(安装easy_install)
2018/04/03 Python
对python中使用requests模块参数编码的不同处理方法
2018/05/18 Python
pandas中去除指定字符的实例
2018/05/18 Python
python获取本机所有IP地址的方法
2018/12/26 Python
Python 网络编程之TCP客户端/服务端功能示例【基于socket套接字】
2019/10/12 Python
使用 Python 合并多个格式一致的 Excel 文件(推荐)
2019/12/09 Python
让IE支持CSS3的不完全兼容方案
2014/09/19 HTML / CSS
CSS3 实现的火焰动画
2020/12/07 HTML / CSS
鉴定评语大全
2014/05/05 职场文书
销售内勤岗位职责范本
2015/04/13 职场文书
《刷子李》教学反思
2016/02/20 职场文书
PyCharm 安装与使用配置教程(windows,mac通用)
2021/05/12 Python
Python函数式编程中itertools模块详解
2021/09/15 Python
Win11 Build 22000.51版本文件资源管理器“命令栏”和上下文菜单有什么新变化?
2021/11/21 数码科技