html5表单提交触发js,JS表单提交中onsubmit事件return的作用

完整代码如下:

1.html

1 html>

2

3

4

JS表单提交中onsubmit事件return的作用

5

6

7

8

9 提交

10

11

12

13

14

15    function Checkname() {

16        var name=document.getElementById('name').value;

17        if (!name) {

18            alert('名字为空');

19            return false;

20        }else{

21            return true;

22        }

23    }

24

2.html

1 html>

2

3

4

JS表单提交中onsubmit事件return的作用

5

6

7    恭喜表单提交成功

8

9

代码运行效果图如下:

1.不填写名字

bVbCWQX

2.填写名字

bVbCWRc

代码分析:

当点击提交按钮(button按钮)的时候,浏览器会自动触发onsubmit事件,执行Checkname()函数。Checkname()函数通过判断名字是否存在,来返回true或者false。

当Checkname()返回false的时候,onsubmit事件可以看成为:

οnsubmit="return false"

当Checkname()返回true的时候,onsubmit事件可以看成为:

οnsubmit="return true"

重点:

此时onsubmit中return的作用就是将Checkname()函数运行返回的结果(true或者false),再向上返回(返回给浏览器)。浏览器如果接收到onsubmit返回的是false,则阻止表单提交。反之,如果接收到的是true,表单就会提交到action属性指向的2.html页面。

b739ec46bb5c46d9c0aa4ce35ba1ea56.png

关于找一找教程网

本站文章仅代表作者观点,不代表本站立场,所有文章非营利性免费分享。

本站提供了软件编程、网站开发技术、服务器运维、人工智能等等IT技术文章,希望广大程序员努力学习,让我们用科技改变世界。

[JS表单提交中onsubmit事件return的作用]http://www.zyiz.net/tech/detail-99829.html

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值