0

我的验证插件的 Ajax errorPlacement 有问题（请参阅此小提琴）。ErrorPlacement结合position:absolute迫使我的 ajax 验证响应弹出在错误的位置。

如果用户尚未输入任何信息，则错误消息会在正确的位置弹出（以红色文本浮动到输入字段的右侧）。但是，如果用户输入了信息，然后将其删除，则 ajax 警报（“此字段为必填项”）会在下面应该出现的字段中的错误位置弹出。要查看问题，请正确输入所有字段，然后删除您的姓名。在电子邮件字段中弹出“此字段为必填项”的消息，但它属于名称字段。

控制验证的js是：

$(document).ready(function() {
        errorPlacement: function(error, element) {
              error.insertAfter( element).position({
                  my:'right top',
                  at:'right top',
                  of:element          
              });
                  error.fadeOut(3000);
         }  
    }); 
});

它导致问题的CSS是：

label.error { position:absolute;}

我需要包含这个 css，以便我可以将错误浮动到输入字段上。请参阅小提琴以查看问题。谢谢！

4

2 回答 2

1

只需修改你的CSS如下：

form p {
    position: relative;   /* This ensures error label is positioned within the p tag */
}
label.error {  
    top: 0; /* This ensures that it lines up with the top of the input */
    right:90px; 
    color: red; 
    position:absolute;
}

甚至在 IE 中测试只是为了确定......

于 2012-03-14T02:29:53.593 回答
1

尼克，你错过了重点（我回答了你之前关于这个的问题）。jQuery UI 有一个Position实用程序。这就是我用来将标签放置在您想要的位置的方法。因此，您的 jsFiddle 中唯一的“错误”是您没有选中资源下的“jQuery UI”框。我制作了您的jsfiddle的一个版本，其中我删除了 right:90px 的东西并检查了 jQuery UI 框。就是这样。

如果您想更改标签相对于其中有错误的元素的定位方式，请查看offset位置实用程序中的选项（上面链接）。

于 2012-03-14T15:56:15.497 回答