仅在表单有效时才调用JS onsubmit

时间:2019-02-23 08:11:57

标签: javascript twitter-bootstrap forms validation bootstrap-4

我是JS的新手。 我有一个引导表单,并使用验证,如下所示:

<form class="needs-validation" novalidate onsubmit="myFunction();">
            <div class="form-group row col-sm-3">
                <label for="exampleInput">Value</label>
                <input type="text" class="form-control" id="exampleInput" placeholder="Enter value" required>
                <div class="invalid-feedback">
                    Value required
                </div>
            </div>
</form>

和JS代码:

    <script>
        (function() {
            'use strict';
            window.addEventListener('load', function() {
                // Fetch all the forms we want to apply custom Bootstrap validation styles to
                var forms = document.getElementsByClassName('needs-validation');
                // Loop over them and prevent submission
                var validation = Array.prototype.filter.call(forms, function(form) {
                    form.addEventListener('submit', function(event) {
                        if (form.checkValidity() === false) {
                            event.preventDefault();
                            event.stopPropagation();
                        }
                        form.classList.add('was-validated');
                    }, false);
                });
            }, false);
        })();
    </script>

验证工作正常,但是在表单无效和有效时始终调用myFunction()。

我如何强制仅在表单有效时才调用myFunction()?

0 个答案:

没有答案