0

私はVSコードで新しい空のHTML、CSS、およびBootstrapプロジェクトを開始し、FormValidation.ioを追加しましたが、何らかの理由でそれは夕方には起動せず、私が行ったことはすべて彼らの主な例です.これはフレームワーク（react、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