What is the default “search” behavior on select/option elements?

Question

I have a Select element that has Option elements with value and text attributes like so:

<select>
  <option value="">-Select-</option>
  <option value="Ok">Ok</option>
  <option value="Orc">Orc</option>
  <option value="Oops">Oops</option>
  <option value="7">7</option>
  <option value="78">78</option>
  <option value="77">77</option>
</select>

Codepen here: http://codepen.io/k/pen/rIbhv

Focusing on the Select and pressing "O" or "7" will select "Ok" or "7", respectively.

Pressing "Oo" or "77" will select "Orc" or "78".

Can someone explain why and/or how the select (or is it the option) element behaves this way? Why is the next option selected, and not the one that was "searched" for? Is this default search behavior outlined anywhere? I tried looking at the w3c docs but was unsuccessful.

I would like to implement a custom search functionality in the future, but wanted to first understand the default search behavior in hopes that it would help my coding.

Any pointers would be appreciated.

Answer 1

It is implementation-specific, but the general "standard" seems to be:

• If you hit the same key repeatedly, cycle through the items starting with that letter.
• If you appear to be typing by pressing different keys, search for that item.