登录页面输入账户后自动变更用户头像信息---已解决

写了一段关于表单登录过程中输入账户后进行判断，若账户存在则自动将当前默认头像转换为用户头像，用的是当失去光标时开始判断，详细代码如下：

  //1.校验用户输入的是正则表达式 先定义正则
  var emailFormat = /^[a-zA-Z0-9]+@[a-zA-Z0-9]+\.[a-zA-Z0-9]+/;
  //2.当失去用户焦点的时候校验邮箱
  $('#email').on('blur', function(){
    //获取用户输入内容
    var value = $(this).val();
    if(!value || !emailFormat.test(value)) return;
    // console.log(value);
    // 接下来需要通过用户的邮箱找到对应的头像地址，然后将头像地址改到img的src上
    // 但是用户js无法操作数据库，应该通过js发送ajax请求告诉服务端的某个接口，让接口帮助客户端获取头像地
    $.get('/admin/api/avatar.php',{ email:value },function(res){
      if(!res) return;
      $('.avatar').fadeOut(function () {
        $(this).on('load',function(){
          $(this).fadeIn()
        }).attr('src',res);
      })
      // $('.avatar').fadeOut(function () {
      //   $(this).on('load',function () {
      //     $this.fadeIn();
      //   }).attr('src', res);
      // })
    })
  })
})

目前解决方案如上，当失去光标时进行判断，为了增强用户体验，加入了淡入和淡出效果，但是此时若用户再次点击用户名输入框的话，就会再次出现淡入淡出效果，目前只能通过取消fadein和fadeout来解决，待以后想到了自己再来解答；

登陆前效果；
进行验证：

输入用户名并离开输入框后会自动变换头像，但是由于加入了淡入和淡出特效，导致再次进入后会再次出现淡入淡出特效；

2019年3月18日更新；
解决代码如下：

$(function($){
  //1.校验用户输入的是正则表达式 先定义正则
  var emailFormat = /^[a-zA-Z0-9]+@[a-zA-Z0-9]+\.[a-zA-Z0-9]+/;
  // var flag = 'true';
  //2.当失去用户焦点的时候校验邮箱
  var lastvalue = null;
  $('#email').on('blur', function(){
    //获取用户输入内容
    var value = $(this).val();
    if(!value || !emailFormat.test(value)) return;
    if(value !== lastvalue){
      $.get('/admin/api/avatar.php',{ email:value },function(res){
      if(!res) return;
      $('.avatar').fadeOut(function () {
        $(this).on('load',function(){
          $(this).fadeIn()
        }).attr('src',res);
      })
      // flag = false;
      // $('.avatar').fadeOut(function () {
      //   $(this).on('load',function () {
      //     $this.fadeIn();
      //   }).attr('src', res);
      // })
    })
    }
    lastvalue = value;
    // 接下来需要通过用户的邮箱找到对应的头像地址，然后将头像地址改到img的src上
    // 但是用户js无法操作数据库，应该通过js发送ajax请求告诉服务端的某个接口，让接口帮助客户端获取头像地
      
  })
})