Question

我输入，没有任何反应。没有建议出现。

如果我检查元素，我可以看到typeahead修改了DOM，但没有弹出窗口。

<script src='https://ajax.googleapis.com/ajax/libs/jquery/1.9.0/jquery.min.js'>
</script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/typeahead.js/0.10.2/typeahead.bundle.min.js"></script>

<script type="text/javascript">
    $(document).ready(function() {
        var colors = ["red", "blue", "green", "yellow", "brown", "black"];
        $('.typeahead').typeahead({source: colors});
    })
</script>
<input class='typeahead'>

Answer 1

根据此处显示的示例http://twitter.github.io/typeahead.js/examples/，您需要一个函数来处理解析结果。

这样可行：

$(function() {
    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)) {
                    // the typeahead jQuery plugin expects suggestions to a
                    // JavaScript object, refer to typeahead docs for more info
                    matches.push({ value: str });
                }
            });
            cb(matches);
        };
    };

    var colors = ["red", "blue", "green", "yellow", "brown", "black"];
    $('.typeahead').typeahead( {}, {source: substringMatcher(colors)} );
});

没有做任何事情

1 个答案: