使用 formvalidation.io 时，我的控制台总是出现错误。
我不知道这个错误的原因是什么。即使我使用后端验证 URL，我仍然会在某些网站上收到垃圾邮件。我正在使用隐形 ReCaptcha (https://formvalidation.io/guide/plugins/recaptcha/ https://formvalidation.io/guide/plugins/recaptcha/)
我的 HTML 表单：
<form id="contact" method="post" action="/vendor/contact-form.php">
<div class="card-body">
<div class="row">
<div class="col-md-6">
<div class="form-group label-floating is-empty">
<label class="bmd-label-floating">Naam</label>
<input type="text" name="naam" id="naam" class="form-control">
<span class="material-input"></span>
</div>
</div>
<div class="col-md-6">
<div class="form-group label-floating is-empty">
<label class="bmd-label-floating">Telefoonnummer</label>
<input type="text" name="telefoon" id="telefoon" class="form-control">
<span class="material-input"></span>
</div>
</div>
</div>
<div class="form-group label-floating is-empty">
<label class="bmd-label-floating">Mailadres</label>
<input type="email" name="email" id="email" class="form-control">
<span class="material-input"></span>
</div>
<div class="form-group label-floating is-empty">
<label for="bericht" class="bmd-label-floating">Uw bericht</label>
<textarea name="bericht" class="form-control" id="bericht" rows="6"></textarea>
<span class="material-input"></span>
</div>
</div>
<div class="card-footer justify-content-between">
<div class="form-check">
<!-- De captcha container -->
<div id="captchaContainer"></div>
</div>
<button type="submit" class="btn btn-brown">Aanvragen</button>
</div>
</form>
这是我的验证脚本（validation-contact.js）：
document.addEventListener('DOMContentLoaded', function(e) {
FormValidation.formValidation(
document.getElementById('contact'),
{
fields: {
naam: {
validators: {
notEmpty: {
message: 'Vul alstublieft uw naam in'
}
}
},
telefoon: {
validators: {
phone: {
country: 'NL',
message: 'U heeft een ongeldig telefoonnummer ingevuld'
},
notEmpty: {
message: 'Vul alstublieft uw telefoonnummer in'
}
}
},
email: {
validators: {
notEmpty: {
message: 'Vul alstublieft uw emailadres in'
},
emailAddress: {
message: 'U heeft een ongeldig emailadres ingevuld'
}
}
},
},
plugins: {
trigger: new FormValidation.plugins.Trigger(),
bootstrap: new FormValidation.plugins.Bootstrap(),
submitButton: new FormValidation.plugins.SubmitButton(),
defaultSubmit: new FormValidation.plugins.DefaultSubmit(),
icon: new FormValidation.plugins.Icon({
valid: 'fa fa-check',
invalid: 'fa fa-times',
validating: 'fa fa-refresh',
}),
recaptcha: new FormValidation.plugins.Recaptcha({
element: 'captchaContainer',
message: 'The captcha is not valid or expired',
// Replace with the site key provided by Google
siteKey: 'MYSITEKEY',
badge: 'bottomleft',
theme: 'light',
size: 'invisible',
backendVerificationUrl: '/vendor/verification-url.php',
}),
},
})
});
编辑： 在我的页面头部有：
<link rel="stylesheet" href="/assets/css/fontawesome-all.css" />
<link rel="stylesheet" href="https://unpkg.com/[email protected] /cdn-cgi/l/email-protection/css/tachyons.min.css">
<link rel="stylesheet" href="/vendor/formvalidation/dist/css/formValidation.min.css">
并在页脚中：
<script src="https://cdnjs.cloudflare.com/ajax/libs/es6-shim/0.35.3/es6-shim.min.js"></script>
<script src="/vendor/formvalidation/dist/js/FormValidation.min.js"></script>
<script src="/vendor/formvalidation/dist/js/plugins/Recaptcha.min.js"></script>
<script src="/vendor/formvalidation/dist/js/plugins/Tachyons.min.js"></script>
<script src="/vendor/formvalidation/dist/js/plugins/Bootstrap.min.js"></script>
编辑：编辑：
The bottom of my page looks like this:
我在 FormValidaiton.io 1.3 版本中遇到了非常类似的问题。对于它的价值，如果它对你有帮助，我通过嵌套任何解决了我的问题form-checka 内的 DIV 元素form-group DIV.
<div class="form-group"><div class="form-check"></div></div>
另一种可行的方法是使用rowSelector选项 - 如本示例中所指定。
https://formvalidation.io/guide/examples/validating-checkbox-list-placed-multiple-columns/ https://formvalidation.io/guide/examples/validating-checkbox-list-placed-multiple-columns/