Javascript 如何在输入字段中键入时显示微调器

我想在键入时启动微调器。当我停止这样做，然后它应该匹配用户名，如果用户名存在，显示勾号图标，否则显示交叉图标，最小字母应该是4

我试着用两个图标，勾号和叉号。我将最小字母条件保持为4，它工作得很好，当我删除那些勾号或叉号应该消失的字符时，它不会消失

如何添加微调器以及如何避免此问题

console.log$id\u用户名； $id\u username.keyup函数{ $lola.show； 如果此.value.length<4{ 回来 } var username=$this.val； console.logusername； $.ajax{ url:“/ajax/validate_username/”， 类型:POST,， 数据：{ “用户名”：用户名， csrfmiddlewaretoken:“{{csrf_令牌}}”， }, 数据类型：“json”， 成功：functiondata{ 控制台日志数据； 如果使用了data.u{ $lola.html； $lola.cssbackground-color，红色； }否则{ $lola.html； } } }; };

---

如果长度为。show，where是。hide？隐藏后如何添加微调器？

console.log($("#id_username"));
$("#id_username").keyup(function() {


  if (this.value.length < 4) {
    $("#lola").hide();
    return
  }
  $("#lola").show();
  var username = $(this).val();
  console.log(username);
  $.ajax({
    url: '/ajax/validate_username/',
    type: "POST",
    data: {
      'username': username,
      csrfmiddlewaretoken: '{{ csrf_token }}',
    },
    dataType: 'json',
    success: function(data) {
      console.log(data);
      if (data.is_taken) {
        $("#lola").html('<i class="glyphicon glyphicon-remove" aria-hidden="true"></i>');
        $("#lola").css("background-color", "red");

      } else {
        $("#lola").html('<i class="glyphicon glyphicon-ok" aria-hidden="true"></i>');
      }
    }
  });

});