form表单提交时验证，如果不对则不跳转页面

最新推荐文章于 2025-05-15 21:38:28 发布

努力学习的阿奇

最新推荐文章于 2025-05-15 21:38:28 发布

阅读量4.9k

点赞数 3

CC 4.0 BY-SA版权

分类专栏： js html 文章标签： form表单验证 form js

本文链接：https://blog.csdn.net/qq_43302195/article/details/89180992

js 同时被 2 个专栏收录

3 篇文章

订阅专栏

html

3 篇文章

订阅专栏

表单提交时验证

这里我们举一个验证复选框是否选择多于两个的例子（多余等于两个就跳转）
主要方法就是在标签中加上 onsubmit

 <html>
<head>
</head>
<body>

<form action="a.html" method="post" "return check()">
<input type="checkbox" value="value1" name="item" onClick="onCheckBox(this);"/> 选项一 
<br>
<input type="checkbox" value="value2" name="item" onClick="onCheckBox(this);"/> 选项二 
<br>
<input type="checkbox" value="value3" name="item" onClick="onCheckBox(this);"/> 选项三 
<br>
<input type="checkbox" value="value4" name="item" onClick="onCheckBox(this);"/> 选项四 
<br> 
<input type="checkbox" value="value5" name="item" onClick="onCheckBox(this);"/> 选项五 
</form>

</body>
</html>


function check() {
        var obj=document.getElementsByName("presetId");
        var num=0;
        for (i=0;i<obj.length ;i++ )
            if (obj[i].checked )
                num+=1;
        if (num<2){
            alert("请选择至少两个点");
            return false;
        }
        return true;
    }

这样我们就可以在提交表单时验证一下表单的正确性，如果是正确的就跳转，如果不是就不跳转。
在这里插入图片描述
像这样，不知道为什么在文中显示不出来，就上个图吧。