form表单用butten提交后无反应&表单提交三种方式

form表单用butten提交后无反应&表单提交三种方式

一,表单提交无反应

有时候,我们发现表单提交的butten按钮,根本就没niao用。鼠标都点烂了,也提交不上去。找了半天什么错误也没找到:(有时候可能是某个地方语法错了,或者命名冲突等)
在这里插入图片描述
既然找不到,索性就不找了,我们换一种提交方式,不能一棵树上吊死是不。

二,表单提交三种方式

1.第一种方式最常见,就是直接一个按钮,type=submit

<form action = "提交的地址">
	<input type="submit" value="提交">
</form>

2.第二种方式就是给按钮添加点击事件,这种方法相对灵活,可以做很多事情,包括ajax异步请求(然后通过回调函数根据后台响应数据,在前端做一些事情)等等。

<form action = "提交的地址">
	<input type="button" value="提交" οnclick="submit()">
</form>

3.第三种方式和第二种方式差不多,但是它更灵活,比如说出发事件的可以不是一个按钮,而是一个超链接或者图片之类的元素。

<form id="form1" action="提交的地址">
	<input type="button" value="提交" οnclick="document.getElementById('form1').submit();">
</form>
<form id="form1" action="提交的地址">
	<a οnclick="document.getElementById('form1').submit();">提交</a>
</form>

三,不能提交表单的其中一种情况,命名占用了submit

<input id="submit"  type="button"  class="one an" value="登录" />(不能提交)
<input name="submit"  type="button"  class="one an" value="登录" />(不能提交)

button的id是“submit”,导致了提交表单功能的失效。按F12,控制台报错了:Uncaught TypeError: form.submit is not a function 。问题的根源在于,对form中的button命名submit,这个名字和form的提交表单方法submit()名字重复了,这就导致了系统无法识别submit()这个方法,所以它不执行了

  • 1
    点赞
  • 8
    收藏
    觉得还不错? 一键收藏
  • 1
    评论
评论 1
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

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

余额充值