通过重写CSS实现使用tooltip显示jquery.validate.unobtrusive验证信息，效果如图：
1. 在ViewModel中定义验证规则
[Display(Name = "纬度")][Required(ErrorMessage = "{0}不能为空")][RegularExpression(@"^\-?\d+(\.\d+)?$", ErrorMessage = "{0}格式不正确，请输入数值")][Range(-90, 90, ErrorMessage = "{0}应在{1}到{2}之间")]public decimal Latitude { get; set; }2. 在页面中添加ValidationMessage
<div class="form-group"> ???@Html.LabelFor(x => x.Latitude, new { @class = "col-sm-2 control-label" }) ???<div class="col-sm-10"> ???????@Html.TextBoxFor(x => x.Latitude, new { @class = "form-control" }) ???????@Html.ValidationMessageFor(x => x.Latitude) ???</div></div>3. 预览页面，查看生成的HTML
有错误信息时，html为
4. 重写CSS
.field-validation-valid > span,.field-validation-error > span { ???position: absolute; ???bottom: -25px; ???padding: 3px 12px; ???background: #f03040; ???color: white; ???font-size: 12px; ???box-shadow: #ccc 3px 3px 3px; ???z-index: 1;}.field-validation-valid > span:before,.field-validation-error > span:before { ???content: ""; ???position: absolute; ???z-index: 1; ???top: -5px; ???left: 12px; ???border-top: 0; ???border-right: 5px solid transparent; ???border-bottom: 5px solid #f03040; ???border-left: 5px solid transparent;}
使用tooltip显示jquery.validate.unobtrusive验证信息
原文地址：https://www.cnblogs.com/zoex/p/jquery-validate-unobtrusive-tooltip.html