概述
目录
- 表单的默认提交
- 理解 onclick 和 onsubmit 参数的先后顺序
- 补充:
- 参考链接
表单的默认提交
一般,后台程序员与表单打交道的时间是最多的
最近学习Html 表单的提交验证,没想到运行时,都会给我自动提交,这真是难为我了,查了一下,原来是onclick/onsubmit
方法的机制问题,我们看似正常传递了函数,用来验证提交是否有问题,如账号或密码是空的验证操作,就不提交表单了。
具体看一下html代码:
<!-- 表单配置 -->
<form action="/index/" method="post" οnsubmit="submitTest();">
<input value="请输入账户">
<input type="submit" value="登录">
</form>
<!-- 脚本函数放置位置 -->
<script>
function submitTest() {
// 一些逻辑判断
return false;
}
</script>
默认自动提交表单
<form action="/index/" method="post" οnsubmit="submitTest();">
该代码仅仅是调用了该函数,而不是获取函数的返回值,这是非常非常要注意的一点
相当于,只是获取函数的对象,但不是获取函数的返回值。
οnsubmit=submitTest=submitTest(){
submitTest()
}
# 调用函数
onsubmit()
不默认,先表单验证,后决定是否提交
<form action="index.jsp" method="post" οnsubmit="return submitTest();">
分析
οnsubmit="return submitTest();"
相当于是 onsubmit=return false;
执行了 return false;
语句
表单的标签的提交,有true
和false
两个验证参数,当表单获取了true
参数,那么就会提交,而且默认的情况下,表单是return true
,也就是自动提交表单,当获取了false
,那么表单就不会提交,而这个获取true
或false
参数的接口,就是onclick
和onsubmit
这两个参数,不过这两个参数,有一个先后执行顺序的要点。
理解 onclick 和 onsubmit 参数的先后顺序
要注意,onclick
参数,要比 onsubmit
参数,要先执行,因为按钮事件肯定比提交表单,要更快些,而且每一个表单,里面如果存在了 type="submit"
的参数,那么就会被定性为触发表单提交的事件,这个无论是input
标签,还是button
标签,只要有这个参数在,那么都是可以定为表单触发器。
因此,选用 onclick 其实会比 onsubmit 更快验证
补充:
-
一般而言,
type="submit"
其实是可以有多个的,只要某个标签,如input
或button
标签触发了,那么就可以提交表单了; -
return true;
或return false;
看来是JavaScript操作。
参考链接
表单提交 οnsubmit=“return false”
form表单的onsubmit() return问题
【php】form表单中的onsubmit与return false
html return作用,js中return;、return true、return false;区别
html静态绑定js 里return是怎么回事怎么用的
最后
以上就是欢呼书本为你收集整理的如何阻止表单的自动提交 - onclick - onsubmit - return true / false;表单的默认提交理解 onclick 和 onsubmit 参数的先后顺序补充:参考链接的全部内容,希望文章能够帮你解决如何阻止表单的自动提交 - onclick - onsubmit - return true / false;表单的默认提交理解 onclick 和 onsubmit 参数的先后顺序补充:参考链接所遇到的程序开发问题。
如果觉得靠谱客网站的内容还不错,欢迎将靠谱客网站推荐给程序员好友。
发表评论 取消回复