jQuery修改form的action值并提交表单的方法

我们在开发项目的工程中,往往会遇到一个页面,一个表单里面放着俩个查询页面,我们希望通过不同的选择查询相应的信息,这时候我们就可以通过修改form表单里的action属性来实现,我们下面就来讲解一下如何实现这一功能。


1
2
3
4
< form  class = "head-tt"  id = "myform"  method = "get"  target = "_blank"  action = "/house/"  >
     < input  name = "keyword"  type = "text"  value = "请输入关键词" >
     < input  name = "button"  value = "提交"  id = "button" >
</ form >


我们来分析一下上面的表单,这是一个以get方式提交的myform为ID的一个表单。提交到的地址为根域名下的/house下,_blank为新打开一个页面的方式。


如果我们想在点击提交按钮之前修改action的地址并且提交相应的表单时,我们可以通过jquery来处理这一操作。

1
2
3
4
5
6
7
$( function (){
     $( "#button" ).click( function (){
         var  newUrl =  '/news/' ;     //设置新提交地址
         $( "#myform" ).attr( 'action' ,newUrl);     //通过jquery为action属性赋值
         $( "#myform" ).submit();     //提交ID为myform的表单
     })
})


这仅仅是一个小特效而已,所以只需要上面几行代码即可实现,不过当你对jquery有一定的了解以后,我相信再复杂的功能你都可以自己实现了。


  • 3
    点赞
  • 12
    收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
©️2022 CSDN 皮肤主题:大白 设计师:CSDN官方博客 返回首页
评论
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、C币套餐、付费专栏及课程。

余额充值