JavaScript自动完成级联下拉菜单/输入

Question

我有一个代码用于自动完成的依赖下拉列表。我可以通过输入中输入的第一个字母在下拉列表中看到这些值。如何显示输入的任何字母是否与数组中值的任何字母匹配，并突出显示匹配的字母。参见示例here on Github。

 var states = {
  'Color': ['red', 'black', 'yellow', 'green', ],
  'Numbers': ['one', 'two', 'three', 'four']
};

function initDialog() {
  clearDialog();
  var $locations = jQuery('#location');

  jQuery(document).on("change", "#country", function() {
        var country = $(this).val(),
          lcns = states[country] || [];

        var html = jQuery.map(lcns, function(lcn) {
          return '<div>' + lcn + '</div>'
        }).join('');
        $locations.html(html)
        if (jQuery('#country').val() == "color") {

          function match(str) {

            str = str.toLowerCase();
            clearDialog();
            for (var i = 0; i < states.color.length; i++) {
              if (states.color[i].toLowerCase().startsWith(str)) {
                jQuery('.dialog').append('<div>' + states.color[i] + '</div>');
              }
            }
          }
          var states = {
            'Color': ['red', 'black', 'yellow', 'green', ],
            'Numbers': ['one', 'two', 'three', 'four']
          };

          function initDialog() {
            clearDialog();
            var $locations = jQuery('#location');

            jQuery(document).on("change", "#country", function() {
                  var country = $(this).val(),
                    lcns = states[country] || [];

                  var html = jQuery.map(lcns, function(lcn) {
                    return '<div>' + lcn + '</div>'
                  }).join('');
                  $locations.html(html)
                  if (jQuery('#country').val() == "color") {

                    function match(str) {

                      str = str.toLowerCase();
                      clearDialog();
                      for (var i = 0; i < states.color.length; i++) {
                        if (states.color[i].toLowerCase().startsWith(str)) {
                          jQuery('.dialog').append('<div>' + states.color[i] + '</div>');
                        }
                      }
                    }