title: Select values from dropdown on keypress
body: <p>I have a select box as in below. Below code is just part of my whole page. It looks like in the image <img src="https://i.stack.imgur.com/Oru0h.png" alt="Please find the drop down Day field"> </p>
  
  <p><strong>Now I want it such that when user types in 8 from keyboard, 8 is selected. If user types in 9, 9 is selected etc.</strong> How to do this?</p>
  
  <p>js fiddle link is at <a href="http://jsfiddle.net/gQ5zV/" rel="nofollow noreferrer">http://jsfiddle.net/gQ5zV/</a> . <strong>It needs to be cross browser compatible with IE 7 if possible.</strong></p>
  
  <pre><code>&lt;div class="form-group col-sm-12"&gt;
          &lt;label for="custom3" class="col-sm-12 control-label myDate"&gt;Date marked on your receipt (dd/mm/yyyy)*&lt;/label&gt;
          &lt;div class="col-sm-4"&gt;
                      &lt;select class="form-control" name="custom3" id="custom3"&gt;
  
              &lt;option value=""&gt;Day&lt;/option&gt;
              &lt;option value="08"&gt;08&lt;/option&gt;
              &lt;option value="09"&gt;09&lt;/option&gt;
              &lt;option value="10"&gt;10&lt;/option&gt;
              &lt;option value="11"&gt;11&lt;/option&gt;
              &lt;option value="12"&gt;12&lt;/option&gt;
              &lt;option value="13"&gt;13&lt;/option&gt;
              &lt;option value="14"&gt;14&lt;/option&gt;
              &lt;option value="15"&gt;15&lt;/option&gt;
              &lt;option value="16"&gt;16&lt;/option&gt;
              &lt;option value="17"&gt;17&lt;/option&gt;
              &lt;option value="18"&gt;18&lt;/option&gt;
              &lt;option value="19"&gt;19&lt;/option&gt;
              &lt;option value="20"&gt;20&lt;/option&gt;
              &lt;option value="21"&gt;21&lt;/option&gt;
              &lt;option value="22"&gt;22&lt;/option&gt;
              &lt;option value="23"&gt;23&lt;/option&gt;
              &lt;option value="24"&gt;24&lt;/option&gt;
              &lt;option value="25"&gt;25&lt;/option&gt;
              &lt;option value="26"&gt;26&lt;/option&gt;
              &lt;option value="27"&gt;27&lt;/option&gt;
              &lt;option value="28"&gt;28&lt;/option&gt;
            &lt;/select&gt;        &lt;/div&gt;
          &lt;div class="col-sm-4"&gt;
            &lt;select class="form-control" name="custom4" id="custom4"&gt;
              &lt;option value="1"&gt;January&lt;/option&gt;
            &lt;/select&gt;
          &lt;/div&gt;
          &lt;div class="col-sm-4"&gt;
            &lt;select class="form-control" name="custom5" id="custom5"&gt;
              &lt;option value="2014"&gt;2014&lt;/option&gt;
            &lt;/select&gt;
          &lt;/div&gt;
          &lt;div class="errorDate col-sm-12"&gt;&lt;/div&gt;
        &lt;/div&gt;&lt;/div&gt;
  </code></pre>