Question

我正在为我的客户端构建一个简单的表单，他们希望在文本字段中显示错误消息。使用jQuery的Validation插件可以实现这一目标吗？

谢谢！

Answer 1

引用OP：

“他们想在文本字段中显示错误消息。请问有可能用jQuery的Validation插件来实现这个目标吗？“

是。可能使用插件的errorPlacement回调函数/选项。

不，我永远不会这样做。这使得用户几乎不可能正确地与表单进行交互。该错误消除了用户已输入的任何数据，并且用户必须删除消息文本以输入其数据。我相信你可以想出克服这些问题的聪明方法，但IMO，从UI的角度来看，这是一个非常糟糕的设计。显示您的客户this demo，然后向下滚动并向其显示my second demo。

DEMO：http://jsfiddle.net/6fUTV/

$(document).ready(function () {

    $('#myform').validate({ // initialize the plugin
        // rules & options,
        errorPlacement: function(error, element) {
            element.val(error.text());
        }
    });

});

编辑：您可以使用placeholder属性。该消息仍然是输入元素中的，但它不会被视为value，因此它不会干扰用户交互。然而，这种方法的一个重大缺点是，如果您有一条规则来验证数据格式，例如email，minlength等......用户将永远不会看到验证消息，因为占位符顶部的字段内有一个值！

errorPlacement: function(error, element) {
    element.attr("placeholder", error.text());
}

DEMO 2：http://jsfiddle.net/n5saemj7/

<强>备选方案：

使用消息气泡显示错误：http://jsfiddle.net/kyK4G/

更多信息：How to display messages from jQuery Validate plugin inside of Tooltipster tooltips?

Answer 2

他们告诉你这是一种不好的方法，也许是。

但您可以使用占位符，而不是替换已有的内容，只需更改此内容：

errorPlacement: function(error, element) {
    element.val(error.text());
}

为此：

errorPlacement: function(error, element) {
    element.attr("placeholder",error.text());
}

希望能帮到你，保重！

Answer 3

是的，当你验证文本字段并且它被捕获时，这是可能的只需将错误消息msg指定为该文本字段或占位符的值。

$("#yourtextfield").val("This field can't be empty.");

Answer 4

是的，你可以。你的技能看起来非常原始。

让我们走简单路径，因为你的问题听起来很简单。出错时，给出一个条件，将消息字符串作为值分配给输入字段。

类似

var err = "err_msg";

$('#elementId').val(err);

请参阅http://api.jquery.com/val/

上的.val('value')部分

jQuery validate - 在文本字段中显示错误消息

4 个答案: