Javascript 引导验证不适用于表单提交

所以我对bootstrap还不熟悉，到目前为止，我的一切都按照我想要的方式工作。我已经创建了一个联系人表单，它使用模式表单，并使用邮件功能通过PHP发送电子邮件

我已经创建了一个脚本来对表单进行验证。如果验证通过，我希望发送电子邮件

当前，当用户提交空白表单时，验证将不起作用，电子邮件将被发送

请记住，我对使用bootstrap还不熟悉

HTML

&时代；
联系我们
XXXX

公司电话：XXXXX

名称
电子邮件
主题
消息
接近
提交

剧本

    $(document).ready(function()
    {
        $validator = $("#contactForm").validate({
            errorClass:'error',
            validClass:'success',
            errorElement:'span',
            highlight: function (element, errorClass, validClass) { 
$(element).parents("div[class='clearfix']").addClass(errorClass).removeClass(validClass);
            }, 
            unhighlight: function (element, errorClass, validClass) { 
    $(element).parents(".error").removeClass(errorClass).addClass(validClass); 
            },
            rules: {
                name: {
                    required: true,
                    minlength: 2
                },
                subject: {
                    required: true,
                    minlength: 10
                },
                email: {
                    required: true,
                    email: true
                },
                message: {
                    required: true,
                    minlength: 10
                }
            },
            messages: {
                name: {
                    required: '<span class="help-inline">Your name is required</span>',
                    minlength: jQuery.format('<span class="help-inline">2 chars</span>')
                },
                subject: {
                    required: '<span class="help-inline">A Subject is required.
    </span>',
     minlength:jQuery.format('<span class="help-inline">10 characters</span>')
                },
                email: {
                    required: '<span class="help-inline">Email.</span>',
                    email: '<span class="help-inline">Ex : name@exemple.com</span>'
                },
                message: {
                    required: '<span class="help-block">Message</span>',
                    minlength: jQuery.format('<span class="help-block">10 chars</span>')
                }
            },
            submitHandler: function(form) 
            {
                $('form').submit(function() {
                    if ($validator.numberOfInvalids() > 0) 
                    {
                        $('#submit').modal('hide');
                    } else 
                    {
                        $('#submit').modal('show');
                    }
                });
            }
        });
    });

$（文档）.ready（函数（）
{
$validator=$（“#contactForm”）.validate({
errorClass:'error'，
validClass:“成功”，
errorElement:“span”，
突出显示：函数（元素、errorClass、validClass）{
$（element）.parents（“div[class='clearfix']”）.addClass（errorClass）.removeClass（validClass）；
}, 
取消高亮显示：函数（元素、errorClass、validClass）{
$（element）.parents（“.error”）.removeClass（errorClass）.addClass（validClass）；
},
规则：{
姓名：{
要求：正确，
最小长度：2
},
主题：{
要求：正确，
最小长度：10
},
电邮：{
要求：正确，
电子邮件：真的
},
信息：{
要求：正确，
最小长度：10
}
},
信息：{
姓名：{
必填项：“您的姓名是必填项”，
minlength:jQuery.format（'2个字符'
},
主题：{
required:'需要一个主题。
',
minlength:jQuery.format（'10个字符'
},
电邮：{
必填项：“电子邮件”，
电子邮件：“例如：name@exemple.com'
},
信息：{
必需：“消息”，
minlength:jQuery.format（'10个字符'
}
},
submitHandler:函数（表单）
{
$（'form'）。提交（函数（）{
如果（$validator.numberOfInvalids（）>0）
{
$（'提交'）.modal（'隐藏'）；
}否则
{
$（'提交'）.modal（'显示'）；
}
});
}
});
});

在每个输入字段上添加“必需”。确保每个字段都有数据的简单方法

<form id="contactForm" method="post" action="scripts/email.php">
                        <div class="modal-body">
                            <div class="form-group">
                                <label for="name">Name</label>
                                <input type="text" name="name" id="name" class="form-control" placeholder="Please enter your full name here." required />
                                <label for="name">Email</label>
                                <input type="text" name="email" id="email" class="form-control" placeholder="Please enter your email address here." required />
                                <label for="name">Subject</label>
                                <input type="text" name="subject" id="subject" class="form-control" placeholder="Please enter your subject here." required />
                                <label for="message">Message</label>
                                <textarea name="message" class="form-control" placeholder="Please enter your message here." required /></textarea>
                            </div>
                        </div>
                      <div class="modal-footer">
                        <button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
                        <button type="submit" class="btn btn-primary">Submit</button>
                      </div>
                  </form>

名称
电子邮件
主题
消息
接近
提交

您是否已经包括jquery和验证库

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script>

<script src="http://cdn.jsdelivr.net/jquery.validation/1.15.0/jquery.validate.min.js"></script>

在输入字段中输入'required'，您的答案是否可以更具描述性？required=“”？我试过了，但它不起作用。我试过了，表单仍然提交，没有进行验证。然后你的脚本干扰了验证，请删除它，并在发送邮件之前在php中进行验证。我考虑过这样做，但我想让其他引导验证工作，因为它看起来更直观。

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script>

<script src="http://cdn.jsdelivr.net/jquery.validation/1.15.0/jquery.validate.min.js"></script>