javascript - 单击输入后删除输入错误消息

Question

我有一个表单，其中我在每个输入字段下方显示验证错误。

<div class="form-group m-0">
    <input type="text" class="form-control" name="address" placeholder="Address">
    <i class="form-group__bar error-red address"></i>
</div>

当Ajax响应有关于输入字段的错误，我在这里显示它们 <i class="form-group__bar error-red address"></i> .

如果当错误显示并且用户单击输入字段时我想要消失错误消息，我想要什么。

有没有这种东西的库，因为表单中有很多字段，如果我们可以为每个表单和字段使用库，那将会很好。

Answer 1

您可以使用 .focusin() 函数。你所要做的就是给每个人上普通课 <i class="form-group__bar error-red address"></i> .就像每个人的共同类(class) <i class="form-group__bar error-red address"></i>是 "form-group__bar"那么你可以像这样使用 focusin。

$(".form-group input").focusin(function() {
  $(this).siblings(".form-group__bar").hide()
});

这将在输入焦点上隐藏错误消息。有关更多信息，您可以搜索 focusin 和 focusout 事件。