JQuery Validation插件消息样式

Question

我正在构建我的Jquery Validation插件的错误消息,我遇到了一些困难.

我已经编辑了插件的代码来改变消息的语言.我知道这可以用javascript完成,但似乎更好的做到'硬编码'.但是在实例中没有看到这一点.

这是现场的例子.我需要以<span></span>某种方式在错误消息之前插入一个,但我无法弄清楚如何.有任何想法吗？

需要明确的是:它应该显示如下:而不是显示带有类'错误'的元素的插件.

<span class='pointer'></span><label class='error'>This is the error</label>

Answer 1

我认为你最好的选择将是错误元素和一些CSS样式的包装:

$('#myform').validate({
    errorPlacement: function(label, element) {
        label.addClass('arrow');
        label.insertAfter(element);
    },
    wrapper: 'span'
});

这会给你这样的错误:

<span class='arrow'>
    <label class='error'>Error</label>
</span>

有了一些CSS,你就可以完成它.

span.arrow {
    margin-left: 6px;
    height:17px;
    background: url('http://i45.tinypic.com/f9ifz6.png') no-repeat left center;
}
label.error {
    height:17px;
    border-top:1px solid #99182c;
    border-right:1px solid #99182c;
    border-bottom:1px solid #99182c;
    margin-left:9px;
    padding:1px 5px 0px 5px;
    font-size:small;
}

现场演示