利用onsubmit事件实现表单提交前的验证

最新推荐文章于 2022-11-12 23:33:35 发布

原创最新推荐文章于 2022-11-12 23:33:35 发布 · 684 阅读

2 ·

CC 4.0 BY-SA版权

JavaScript 专栏收录该内容

3 篇文章

订阅专栏

本文介绍了一个简单的JavaScript函数，用于验证HTML表单中的用户名字段是否为空。通过onsubmit事件触发验证函数，确保只有当输入有效时才提交表单。

JS代码：

function check(){
    var name = document.getElementById("name").value;
    if(name ==  null || name == ''){
        alert("用户名不能为空");
        return false;
    }
    return true;
}

<form name="form" action="跳转的页面" method="post"  onsubmit="return check()">
    <input type="text" id="name"/>
    <input type="sumit" value="提交"/>
</form>

注意：

οnsubmit="return check()"中的return是一定要加上的，否则check的返回值即使是false，仍然会提交。

换句话说，οnsubmit=“return false”为不执行提交；οnsubmit=“return true”或οnsubmit=“return ”都执行提交。