Question

当我有这个时，div只有文本，它使用它可以的所有水平宽度，所以在文本后面有尾随宽度，我可以从背景颜色中看出。

    errorElement: "div",
    errorPlacement: function(error, element) {

            error.insertBefore("#zzz");

当我使用它时，宽度与包含的文本相同，但我不能通过display：block。将每个单独的错误（span）放在一个单独的行上。

    errorElement: "span",
    errorPlacement: function(error, element) {

            error.insertBefore("#zzz");
            error.css("display", "block");

还有另一种方法可以在span元素上强制中断吗？

Answer 1

您可以在span内为div提供具有不同背景颜色的<li>。

此外，{{1}}

Answer 2

这对我有用。这不是最好的方式，但如果有人有更多的可维护性，请告诉我。我对显示器感到有点恼火：阻挡不适用于跨度。哦，好吧。

 errorElement: "div",
 errorPlacement: function(error, element) {

     error.insertBefore("#zzz");      

     if (error.text() == 'Password Required')
     {
          error.css("width", "135px");
     }
     else
     {
          error.css("width", "165px");
     }

Answer 3

抱歉，我对你所寻找的内容感到困惑，但我的评论如下。为什么不使用html元素强制换行而不是试图将它变成css呢？如果您希望每个错误范围都在一个单独的行上，请将其包装在<p>或添加<br/>。

这样的事情应该有效：

errorElement: "span",
errorPlacement: function(error, element) {
        error.wrap('<p>');
        // alternative:  error.append('<br/>');
        error.insertBefore("#zzz");

正如@Victor建议的那样，li元素而不是span在语义上也是一个不错的选择。（毕竟这是一个错误列表。）你还需要一个<ul>包含错误部分。

样式化jQuery验证

3 个答案: