Javascript

Question

我有一个输入显示电子邮件格式无效的消息。当遵守格式时，此消息消失。

$('#id_email.form-control').keyup(function(){
$('span.error-keyup-email').remove();
var inputVal = $(this).val();
var emailReg = /^([\w-\.]+@([\w-]+\.)+[\w-]{2,4})?$/;
if(!emailReg.test(inputVal)){
  $(this).after('<span style="color:red;" class="error error-keyup-email">Invalid Email Format.</span>');
}
});

代码运行良好。这正是我想要的。

问题： 当我 select 一封我已经由浏览器保存的电子邮件时（通常它会为用户保存电子邮件或伪）。当我不输入我的电子邮件而是 select 我的电子邮件时，即使它是正确的电子邮件格式，消息仍然保留在输入的下方。

你有什么想法吗？

如果您愿意，我可以为您提供更多详细信息，感谢您花时间解决我的问题:)

祝你有愉快的一天:)

Answer 1

//删除else中的错误范围

$('#id_email.form-control').keyup(function(){
    $('span.error-keyup-email').remove();
    var inputVal = $(this).val();
    var emailReg = /^([\w-\.]+@([\w-]+\.)+[\w-]{2,4})?$/;
    if(!emailReg.test(inputVal)){
      $(this).after('<span style="color:red;" class="error error-keyup-email">Invalid Email Format.</span>');
    }
  else{
      $('span.error-keyup-email').remove();
  }
    });

Answer 2

使用失去焦点时自动调用的输入更改事件

$('#id_email.form-control').change(function(){

});

Answer 3

试试这个：

$('#id_email.form-control').on('input', function(){
$('span.error-keyup-email').remove();
var inputVal = $(this).val();
var emailReg = /^([\w-\.]+@([\w-]+\.)+[\w-]{2,4})?$/;
if(!emailReg.test(inputVal)){
  $(this).after('<span style="color:red;" class="error error-keyup-email">Invalid Email Format.</span>');
}
});

keyup 仅在按下键时触发。 input 当值改变时立即触发

Answer 4

问题是当从浏览器使用自动填充时，您必须以某种方式检测它。不幸的是，在这种情况下不会触发输入的更改事件。

一个可能的解决方案可能是遍历所有onload的输入字段并检查它们是否已填写

Javascript - 从输入中移除焦点

Javascript - Remove the focus from input

email

jquery

keyup