form 表单提交前考证 onsubmit

2019年9月1日 198次阅读 来源: Guoye

运用form表单的onsubmit要领，在提交表单之前，对表单或许网页中的数据举行磨练。

onsubmit指定的要领返回true，则提交数据；返回false不提交数据。

在不运用JQuery的情况下（js原生），是提交表单前阻拦的较好要领。

js考证form表单，示例代码：

<!DOCTYPE html>
<html>

<head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width">
    <title>form validate</title>
    <script src="https://code.jquery.com/jquery-1.9.1.js"></script>

    <script>
        function validate() {
            // 为了轻易 运用了jq猎取表单元素的值，能够运用js原生猎取
            if ($('#input').val() == 1) {
                return true
            } else {
                alert('validate error!')
                return false
            }
        }
    </script>
</head>

<body>
    <form action="http://www.baidu.com" onsubmit="return validate()">
        <input type="text" id="input">
        <input type="submit" id="submit" value="提交" />
    </form>
</body>

</html>
    原文作者：Guoye
    原文地址: https://segmentfault.com/a/1190000018892496
    本文转自网络文章，转载此文章仅为分享知识，如有侵权，请联系博主进行删除。
点赞