title: Jquery: Delay on the OnChange function
body: <p>I have a problem with my onChange function. What I want to do is when the user goes into the input and gets out without adding any values, it should indicate that the input is empty. For the text box it does not work. As well as when inputting the year, there should be 4 numbers but when the 4 numbers are typed, it gives an error from what I can tell it gets the value before the last number was typed. How could I fix this? Thanks!</p>
  
  <pre><code>&lt;script&gt;
  
              //Here is the number validation function
              $(document).ready(function(){
                  $("input").keydown(function(a){
                      var howMany = 0;
                      //Here I am getting the key code and making it into a string
                      a = String.fromCharCode(a.keyCode);
                      //Here I make the other keys I want to use and
                      //Storing them into variables
                      var backspaceKey = String.fromCharCode(8);
                      var tabKey = String.fromCharCode(9);
                      var enterKey = String.fromCharCode(13);
                      howMany = $("#year").val();
                      //Validating the input here, no more than 4 numbers and
                      //backspace and other functional keys are included
                      if(howMany.length &gt; 3){
                          if(a == backspaceKey ||
                            a == tabKey ||
                            a == enterKey){
                              return true;
                          }else{
                              return false;
                          }
                      }
                  });
  
                  $("#year").on('change',function(){
                      if(!$("#year").val()){
                          alert("empty");
                          emptyBox("#year");
                          errorBox("#year");
                          return false;
                      }else if($("#year").val() != 4){
                          errorBox("#year");
                          alert("short num");
                      }
                  });
  
                  $("#submit").click(function(){                    
                      var year = $("#year").val();
                      var description = $("#description").val();
  
                      if(!$.trim($("#year").val())){
                          alert("True year");
                          emptyBox("#year");
                          errorBox("#year");
                          return false;
                      }
  
                      if(!$.trim($("#description").val())){
                          alert("true" + description);
                          emptyBox("#description");
                          errorBox("#description");
                          return false;
                      }
                  });
              });
  
  
              //Takes away the error
              function validated(name){
                  //$(name).after
              }
  
  
              //checks if its empty
              function emptyBox(name){
                  $(name).after("&lt;p class='text-center'&gt;Error, Cannot be empty&lt;/p&gt;");
              }
  
              //Function that changes the color of the input box if error
              function errorBox(name){
                  $(name).css({
                      border: "2px solid red"
                  })
              }
          &lt;/script&gt;
  
  
  
  
  
  &lt;label for="year"&gt;Year&lt;/label&gt;
                      &lt;input type="number" class="form-control year" id="year" placeholder="Enter the Year of Event" onchange="year()"&gt;
                      &lt;br&gt;
                      &lt;lable for="description"&gt;Description&lt;/lable&gt;
                      &lt;textarea id="description" class="form-control" placeholder="Describe the Event"&gt;&lt;/textarea&gt;
  </code></pre>
  
  <p>DEMO: <a href="https://jsfiddle.net/efoc/tx51jj2v/" rel="nofollow noreferrer">https://jsfiddle.net/efoc/tx51jj2v/</a></p>