Javascript 使用formvalidation.io v0.8.1验证表单 我想用V0.81（jQuery插件验证表单字段，验证Bootstrap 3/4·Basic 5/6·纯·语义UI·UIKIT·其他）来验证表单的有效性。
这是我的HTML页面：Javascript 使用formvalidation.io v0.8.1验证表单 我想用V0.81（jQuery插件验证表单字段，验证Bootstrap 3/4·Basic 5/6·纯·语义UI·UIKIT·其他）来验证表单的有效性。,javascript,html,bootstrap-modal,formvalidation.io,Javascript,Html,Bootstrap Modal,Formvalidation.io,这是我的HTML页面： .... <!-- for the error login message box --> <link rel="stylesheet" media="screen" href="/tdk/webjars/bootstrap/3.3.7-1/css/bootstrap.min.css" /> <link rel="stylesheet" type="text/css" href="/tdk/css/formvalid
....
<!-- for the error login message box -->
<link rel="stylesheet" media="screen" href="/tdk/webjars/bootstrap/3.3.7-1/css/bootstrap.min.css" />
<link rel="stylesheet" type="text/css" href="/tdk/css/formvalidation.css" />
<body>
<div class="container">
<div class="row">
<div class="col-md-6 col-md-offset-3 text-center">
<div class="alert alert-danger alert-dismissible" role="alert">
<button type="button" class="close" data-dismiss="alert" aria-label="Close">
<span aria-hidden="true">x</span>
</button>
<p>Nombre de usuario o contraseña incorrecta"</p>
</div>
</div>
</div>
<div class="row">
<div class="col-md-6 col-md-offset-3">
<div class="well">
<div class="text-center">
<h1>??login.h1.text_es_ES??</h1>
<p class="lead">??login.p.lead_es_ES??</p>
</div>
<div class="text-left">
<form id="loginForm" method="post" action="/tdk/login">
<div class="form-group">
<label for="username">??login.username.text_es_ES??</label>
<input type="text" id="username" name="username" class="form-control" />
</div>
<div class="form-group">
<label for="password">??login.password.text_es_ES??</label>
<input type="password" id="password" name="password" class="form-control" />
</div>
<div class="form-group">
<button type="submit" class="btn btn-primary">??navbar.login.text_es_ES??</button>
</div>
<input type="hidden" name="_csrf" value="ab14a342-9157-474f-9462-f56940812b6a" /></form>
<a href="/tdk/forgotmypassword">Ha olvidado su clave de acceso ?</a>
</div>
</div>
</div>
</div>
</div>
<!-- Js zone -->
<div>
<script src="/tdk/webjars/jquery/3.2.0/jquery.min.js"></script>
<!-- <script th:src="@{/webjars/bootstrap/3.3.7-1/js/bootstrap.min.js}"></script> -->
<!-- <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.4/jquery.min.js" type="text/javascript"></script> -->
<script type="text/javascript" src="/tdk/tdk/js/jquery.floatThead.min.js"></script>
<script src="/tdk/tdk/js/jquery.mCustomScrollbar.concat.min.js"></script>
<script src="https://cdn.datatables.net/1.10.13/js/jquery.dataTables.min.js"></script>
<!-- <script th:src="@{/js/ui.js}" type="text/javascript"></script> -->
<!-- <script th:src="@{/webjars/jquery/3.2.0/jquery.min.js}"></script> -->
</div>
<script src="/tdk/webjars/bootstrap/3.3.7-1/js/bootstrap.min.js"></script>
<script src="tdk/js/formvalidation/tdk.js"></script>
<script src="tdk/js/formvalidation/base.js"></script>
<script src="tdk/js/formvalidation/bootstrap.js"></script>
...
and my tdk.js
/* Login page form validation */
$('#loginForm').formValidation({
framework: 'bootstrap',
icon: {
valid: 'glyphicon glyphicon-ok',
invalid: 'glyphicon glyphicon-remove',
validating: 'glyphicon glyphicon-refresh'
},
fields: {
username: {
validators: {
notEmpty: {
message: 'The username is required'
}
}
},
password: {
validators: {
notEmpty: {
message: 'The password is required'
}
}
}
}
});
。。。。
x
“不正确的合同名称”
？？login.h1.文本？？
登录.p.lead
？？登录名、用户名、文本？？
？？登录、密码、文本？？
？导航栏、登录、文本？？
...
还有我的tdk.js
/*登录页面表单验证*/
$（“#loginForm”）.formValidation({
框架：“bootstrap”，
图标：{
有效：“glyphicon glyphicon ok”，
无效：“glyphicon glyphicon删除”，
正在验证：“glyphicon glyphicon刷新”
},
字段：{
用户名：{
验证器：{
注意：{
消息：“用户名是必需的”
}
}
},
密码：{
验证器：{
注意：{
消息：“密码是必需的”
}
}
}
}
});
但是客户端没有进行任何验证我认为您必须将验证器放在document.ready函数中，以便初始化验证器 试试这个
请创建一个可以上传的工作演示？您可以使用JsFiddle或codepended创建一个演示。您可以修复这个问题吗？您必须上传源文件，在文档加载事件中初始化表单后，如何手动检查表单是否有效？var form=$（“#loginForm”）var fv=form.data（'formValidation'））；fv.validateContainer（表单）；var isValid=fv.isValidContainer（表单）；
$( document ).ready(function() {
/* Login page form validation */
$('#loginForm').formValidation({
framework: 'bootstrap',
icon: {
valid: 'glyphicon glyphicon-ok',
invalid: 'glyphicon glyphicon-remove',
validating: 'glyphicon glyphicon-refresh'
},
fields: {
username: {
validators: {
notEmpty: {
message: 'The username is required'
}
}
},
password: {
validators: {
notEmpty: {
message: 'The password is required'
}
}
}
}
});
});