asp.net - jQuery验证-在控件和错误摘要旁边显示错误图标

Question

我在目前正在开发的应用程序(ASP.NET)中使用Jquery验证很有趣。

在JQuery中使用默认设置确实弄乱了表单的布局。我想在表单顶部显示错误摘要，并在控件旁边 float 一个图标以指示错误输入。

我知道如何在表单顶部获取错误摘要，但不确定如何在控件旁边显示图标。

我什至不确定是否可以同时做这两个事情。

谢谢

Answer 1

您可以选择将处理程序添加到验证插件:

$("#form").validate({ 
  errorPlacement: function(error, element) {
    error.wrap("<li></li>").appendTo($("#top")); 
    $('<div class="errorIcon"></div>').insertAfter(element);
  }
});

<ul id="top" class="errors"></ul>

.errors { color: red; }
.errorIcon { background: url(errorIcon.png); width: 16px; height: 16px; float: right; }

这会将错误附加到ID为“top”的元素上，并在引发错误的元素旁边添加一个 float 错误。希望这是您要遵循的想法，如果不提出意见，我会进行修改。