0

我已经在 VS 代码中启动了一个新的空白 HTML、CSS 和 Bootstrap 项目，并且我添加了 FormValidation.io 但由于某种原因它没有在晚上启动，我所做的只是以他们的主要示例为例，有人知道为什么吗？这需要是框架（反应，vue）的一部分，还是我只是错过了一些东西？但是当我点击提交按钮时没有任何反应

<html>
<head>
    <link rel="stylesheet" href="/plugins/bootstrap/css/bootstrap.min.css" />
    <link rel="stylesheet" href="/plugins/formvalidation/dist/css/formValidation.min.css" />
</head>
<body>
    <div class="container">
        <div class="row">
            <div class="col-xl-6">
                <form id="loginForm" method="POST">
                    <div class="form-group">
                        <label>Username</label>
                        <input class="form-control" type="text" name="username" />
                    </div>
            
                    <div class="form-group">
                        <label>Password</label>
                        <input class="form-control" type="password" name="password" />
                    </div>
            
                    <button class="btn btn-primary" type="submit">Submit</button>
                </form>
            </div>
        </div>
    </div>
    
    <script src="/plugins/jquery.js"></script>
    <script src="/plugins/bootstrap/js/bootstrap.min.js"></script>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/es6-shim/0.35.3/es6-shim.min.js"></script>
    <script src="/plugins/formvalidation/dist/js/FormValidation.full.min.js"></script>
    <script src="/plugins/formvalidation/dist/js/plugins/Bootstrap.min.js"></script>

    <script>
        document.addEventListener('DOMContentLoaded', function(e) {
            FormValidation.formValidation(
                document.getElementById('loginForm'),
                {
                    fields: {
                        username: {
                            validators: {
                                notEmpty: {
                                    message: 'The username is required'
                                },
                                stringLength: {
                                    min: 6,
                                    max: 30,
                                    message: 'The username must be more than 6 and less than 30 characters long',
                                },
                                regexp: {
                                    regexp: /^[a-zA-Z0-9_]+$/,
                                    message: 'The username can only consist of alphabetical, number and underscore',
                                },
                            }
                        },
                        password: {
                            validators: {
                                notEmpty: {
                                    message: 'The password is required'
                                },
                                stringLength: {
                                    min: 8,
                                    message: 'The password must have at least 8 characters',
                                },
                            }
                        },
                    },
                    plugins: {
                        bootstrap: new FormValidation.plugins.Bootstrap(),
                    },
                }
            );
        });    
        </script>
</body>
4

0 回答 0