使用 jquery 的自定义验证器遇到一些问题

Question

我在让自定义验证器与 jQuery 一起工作时遇到问题。

这是我创建的用于检查文本框是否包含 PO BOX 的函数。

function valPoBox(sender, args) {
    var hasPObox = "^P\.?\s?O\.?\sB[Oo][Xx].";
    var StreetAddress = $('.streetaddress').val();
    var match = StreetAddress.match(RegExp(hasPObox));
    if (!match) {
        args.IsValid = false;
        sender.ErrorMessage = "Address must not contain P.O. Box";
        $('.valPoBox').attr("ErrorMessage", sender.ErrorMessage);
    }
    else {
        args.IsValid = true;
    }
}

当我跳出文本框时会触发该函数，并将按照逻辑进入 args.IsValid = false;但它不会显示错误消息。

任何想法我做错了什么？

Answer 1

$('.valPoBox').attr("ErrorMessage", sender.ErrorMessage); 的最后一行实际上不是有效代码。 attr 函数在元素上设置 HTML 属性。我猜你想要做的是在输入之后添加一段文本，并在验证失败后向用户显示。

例如，你可以有这样的东西：

<input class="streetaddress" /><span id="PoBoxError"></span>

你的 JS 然后变成这样的东西：

    ...
    $('#PoBoxError').html(sender.ErrorMessage);
} else {
    args.IsValid = true;
    $('#PoBoxError').html('');
}

这会在输入错误消息之后设置跨度，并在通过验证后再次隐藏它。这只是您可以实现此目的的方法之一，其他方法涉及显示和隐藏内容，但我试图使答案尽可能接近您的原始代码。