输入框错误提示怎么自动隐藏不起来？

❤忠娟提问于 2026-01-29 16:55:45 阅读 66

交互

我给表单加了实时验证，但输入正确后错误提示就是不消失，这是怎么回事啊？

比如这个邮箱输入框，当我输入错误格式后提示会显示，但改成正确格式时提示还是卡在那里：



请输入正确邮箱格式

我用的是blur事件监听，代码大概是这样写的：

当输入值匹配正则就移除错误类，但实际操作时发现，即使输入正确，错误提示也不会自动隐藏，除非刷新页面。我试过手动调用removeClass但没反应，是不是事件绑定哪里出问题了？

我来解答赞 18 收藏

反馈

2 条解答

Des.芸菡 Lv1

啊这...八成是事件绑定时机问题。试试改成input事件+blur双监听，这样实时验证和失焦都能触发：

$('#email').on('input blur', function() {

  if (/正则/.test(this.value)) {

    $(this).removeClass('error-class');

  }

});

要是还不行，检查下是不是有其他js冲突，我昨晚改这种bug改到三点...

2026-03-06 23:03

司徒欣胜 Lv1

blur事件只在失去焦点时触发，改正确了不会重新触发。改成input事件监听就能实时检测并更新状态，搞定。

input.addEventListener('input', () => {

    if (regex.test(input.value)) {

        input.classList.remove('error');

    } else {

        input.classList.add('error');

    }

});

2026-01-29 23:03