twitter-bootstrap jQuery Bootstrap 验证不起作用
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/23253537/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
jQuery Bootstrap validation not working
提问by Harsh Bahua
I have used bootstrapValidator.js to validate my page, but I cannot validate my page. The validator download link is: https://github.com/nghuuphuoc/bootstrapvalidator. What is the possible error? Im using Netbeans as the IDE.
我已经使用 bootstrapValidator.js 来验证我的页面，但我无法验证我的页面。验证器下载链接是：https: //github.com/nghuuphuoc/bootstrapvalidator。可能的错误是什么？我使用 Netbeans 作为 IDE。
<%@page contentType="text/html" pageEncoding="UTF-8"%>
<html>
<head>
<meta name="viewport" content="width=device-width">
<link rel="stylesheet" href="https://netdna.bootstrapcdn.com/bootstrap/3.1.1/css/bootstrap.min.css">
<link rel="stylesheet" href="validator/dist/css/bootstrapValidator.min.css"/>
<script type="text/javascript" src="validator/src/js/bootstrapValidator.js"></script>
<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/2.0.3/jquery.min.js"></script>
<script type="text/javascript" src="https://netdna.bootstrapcdn.com/bootstrap/3.1.1/js/bootstrap.min.js"></script>
<script>
$(document).ready(function() {
$('#RegisterForm').bootstrapValidator({
fields: {
firstName: {
validators: {
notEmpty: {
message: 'The first name is required and cannot be empty'
}
}
`enter code here` },
lastName: {
validators: {
notEmpty: {
message: 'The last name is required and cannot be empty'
}
}
},
email: {
validators: {
notEmpty: {
message: 'The email address is required'
},
emailAddress: {
message: 'The input is not a valid email address'
}
}
},
gender: {
validators: {
notEmpty: {
message: 'The gender is required'
}
}
}
},
submitHandler: function(validator, form, submitButton) {
var fullName = [validator.getFieldElements('firstName').val(),
validator.getFieldElements('lastName').val()].join(' ');
$('#helloModal')
.find('.modal-title').html('Hello ' + fullName).end()
.modal();
}
});
});
</script>
</head>
<body>
<jsp:include page="header.jsp" flush="true" />
<br>
<br>
<br>
<br>
<form id="RegisterForm" class="form-horizontal">
<div class="form-group">
<label class="col-md-3 control-label">Full name</label>
<div class="col-md-4">
<input type="text" class="form-control" name="firstName" />
</div>
<div class="col-md-4">
<input type="text" class="form-control" name="lastName" />
</div>
</div>
<div class="form-group">
<label class="col-md-3 control-label">Email address</label>
<div class="col-md-6">
<input type="text" class="form-control" name="email" />
</div>
</div>
<div class="form-group">
<label class="col-md-3 control-label">Gender</label>
<div class="col-md-6">
<div class="radio">
<label><input type="radio" name="gender" value="male" /> Male</label>
</div>
<div class="radio">
<label><input type="radio" name="gender" value="female" /> Female</label>
</div>
<div class="radio">
<label><input type="radio" name="gender" value="other" /> Other</label>
</div>
</div>
</div>
<div class="form-group">
<div class="col-md-offset-3 col-md-8">
<button type="submit" class="btn btn-primary">Say hello</button>
</div>
</div>
</form>
</body>
</html>
回答by Sparky
Your problem is likely here, where you've included a jQuery plugin before jQuery itself...
您的问题可能在这里，您在 jQuery 本身之前包含了一个 jQuery 插件......
<script type="text/javascript" src="validator/src/js/bootstrapValidator.js"></script>
<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/2.0.3/jquery.min.js"></script>
<script type="text/javascript" src="https://netdna.bootstrapcdn.com/bootstrap/3.1.1/js/bootstrap.min.js"></script>
The Bootstrap Validator pluginis a jQueryplugin, so the jQuery library mustbe included first. Since it also depends on Bootstrap, it should probably come after that too...
该引导验证插件是一个jQuery的插件，所以jQuery库必须包含第一。由于它也依赖于 Bootstrap，它可能也应该在此之后......
<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/2.0.3/jquery.min.js"></script>
<script type="text/javascript" src="https://netdna.bootstrapcdn.com/bootstrap/3.1.1/js/bootstrap.min.js"></script>
<script type="text/javascript" src="validator/src/js/bootstrapValidator.js"></script>
