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

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

使用此代码没有库只需要你已经使用的jquery

$("input").focus(function(){
   $(this).siblings("i.error-red").hide();
});

Answer 2

你可以使用.focusin（）函数。你要做的就是给每个<i class="form-group__bar error-red address"></i>提供一个共同的课程。 比如每个<i class="form-group__bar error-red address"></i>的公共类是“form-group__bar”，那么你可以像这样使用focusin。

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

这将隐藏输入焦点上的错误消息。 您可以搜索焦点和焦点事件。