如何为引导程序typeahead.js自动完成设置类名

Question

我正在使用typeahead.js自动完成功能。我在下面的链接中看到了为预输入设置类名的模式。

https://github.com/twitter/typeahead.js/blob/master/doc/jquery_typeahead.md#class-names

我尝试了以下选项，但无法更改自动输入的默认类名称

 $('#the-basics .typeahead').typeahead({
            hint: false,
            highlight: true,
            classNames: {
                input: 'dummy',
                hint: 'dummy',
                menu: 'dummy',
                dataset: 'dummy',
                suggestion: 'dummy',
                empty: 'dummy',
                open: 'dummy',
                cursor: 'dummy',
                highlight: 'dummy',

            }
        },          
        {
            name: 'states',
            displayKey: 'value',
            source: substringMatcher(states),                
            templates: {
                empty: [
                    '<div class="empty-message">No States Found</div>'
                ],
                header: '<h3 class="league-name">States of USA</h3>'
            }
        });

Answer 1

这是一个工作中的jsfiddle，您将在其中看到 classNames 工作正常。

另请参阅下面的代码片段。

var substringMatcher = function(strs) {
  return function findMatches(q, cb) {
    var matches, substringRegex;

    // an array that will be populated with substring matches
    matches = [];

    // regex used to determine if a string contains the substring `q`
    substrRegex = new RegExp(q, 'i');

    // iterate through the pool of strings and for any string that
    // contains the substring `q`, add it to the `matches` array
    $.each(strs, function(i, str) {
      if (substrRegex.test(str)) {
        matches.push(str);
      }
    });

    cb(matches);
  };
};

var states = ['Alabama', 'Alaska', 'Arizona', 'Arkansas', 'California',
  'Colorado', 'Connecticut', 'Delaware', 'Florida', 'Georgia', 'Hawaii',
  'Idaho', 'Illinois', 'Indiana', 'Iowa', 'Kansas', 'Kentucky', 'Louisiana',
  'Maine', 'Maryland', 'Massachusetts', 'Michigan', 'Minnesota',
  'Mississippi', 'Missouri', 'Montana', 'Nebraska', 'Nevada', 'New Hampshire',
  'New Jersey', 'New Mexico', 'New York', 'North Carolina', 'North Dakota',
  'Ohio', 'Oklahoma', 'Oregon', 'Pennsylvania', 'Rhode Island',
  'South Carolina', 'South Dakota', 'Tennessee', 'Texas', 'Utah', 'Vermont',
  'Virginia', 'Washington', 'West Virginia', 'Wisconsin', 'Wyoming'
];

$('#the-basics .typeahead').typeahead({
  classNames: {
    input: 'dummy',
    hint: 'dummy',
    menu: 'dummy',
    dataset: 'dummy',
    suggestion: 'dummy',
    empty: 'dummy',
    open: 'dummy',
    cursor: 'dummy',
    highlight: 'dummy',
  },
  hint: true,
  highlight: true,
  minLength: 1,
}, {
  name: 'states',
  source: substringMatcher(states)
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<script src="https://twitter.github.io/typeahead.js/releases/latest/typeahead.bundle.js"></script>

<div id="the-basics">
  <input class="typeahead" type="text" placeholder="States of USA">
</div>