Observable Field.js

Demo

Item 1:

Item 2: JavaScript PHP Node.js MongoDB

Installation

<script src="js/jquery.js"></script>
<script src="js/jQuery.ObservableField.js"></script>
<script>
  $(function() {
    // Executes a callback detecting changes with a frequency of 100 milliseconds (tenth of a second)
    $("input").ObservableField(100, function( ) {
      // Display change and then fade out after a few seconds if the user has stopped typing
      if (inDelay == false) {
        $("#msg").fadeTo(0,1)
                 .html('Input change observed! New value: ' + this.value )
                 .animate({},0,function() {
                    inDelay = true;
                  }) // END animate
                 .delay(5000)
                 .animate({},0,function(){
                      inDelay = false;
                      $("#msg").fadeTo(1000,0)
                   }); // END animate
      }
    });
    $("select").ObservableField(100, function( ) {
      alert('Select change observed! New value: ' + this.value );
    });
	
  });
</script>
...
  <form>

    <p>
      <label for="item1">Item 1:</label>
      <input type="text" id="item1" value=""> <span id="msg"></span>
    </p>
    <p>
      <label for="item2">Item 2:</label>
      <select id="item2" >
        <option value="JavaScript">JavaScript</option>
        <option value="PHP">PHP</option>
        <option value="Node.js">Node.js</option>
        <option value="MongoDB">MongoDB</option>
      </select>
    </p>

  </form>

This is a jQuery plugin that implements a way to observe form fields on a near real-time frequency, instead of having to rely on blur (too cumbersome for the user) or keyup (does not account for pasting of values or programmettically entered values).