JSFiddle - React, Tailwind, and code Playground
HTML
<select id="SomeDropdown">
<option value="0">Nothing Here</option>
<option value="1"> - Requirement Analysis</option>
<option value="2"> - - Training & Self Learning</option>
<option value="3"> - - - Bug Fixing</option>
<select>
JavaScript
//setup before functions
var typingTimer; //timer identifier
var doneTypingInterval = 500; //time in ms, 5 second for example
var keyText='';
//on keyup, start the countdown
$('#SomeDropdown').keyup(function(e){
clearTimeout(typingTimer);
keyText+=String.fromCharCode(e.which);
typingTimer = setTimeout(doneTyping, doneTypingInterval);
});
//on keydown, clear the countdown
$('#SomeDropdown').keydown(function(e){
clearTimeout(typingTimer);
});
//user is "finished typing," do something
function doneTyping () {
console.log(keyText)
$("#SomeDropdown option").filter(function() {
return this.text.replace(/(\-\s)/gi, '').toUpperCase().lastIndexOf(keyText, 0) === 0;
}).attr('selected', true);
keyText='';
}