Question

我无法理解为什么这个教程示例对我不起作用：

我有外部js库：

“https://ajax.googleapis.com/ajax/libs/jquery/1.11.2/jquery.min.js” “http://twitter.github.io/typeahead.js/releases/latest/typeahead.bundle.js”

这个代码在加载文档：

<script type="text/javascript">
$(document).ready(function () {
    $('input.typeahead').typeahead({
        name: 'cars',
        local: ['Audi', 'BMW', 'Bugatti', 'Ferrari', 'Ford', 'Lamborghini', 'Mercedes Benz', 'Porsche', 'Rolls-Royce', 'Volkswagen']
    });
});
</script>

我有css：

   <style type="text/css">
        .bs-example {
            font-family: sans-serif;
            position: relative;
            margin: 100px;
        }
        .typeahead, .tt-query, .tt-hint {
            border: 2px solid #CCCCCC;
            border-radius: 8px;
            font-size: 24px;
            height: 30px;
            line-height: 30px;
            outline: medium none;
            padding: 8px 12px;
            width: 396px;
        }
        .typeahead {
            background-color: #FFFFFF;
        }
        .typeahead:focus {
            border: 2px solid #0097CF;
        }
        .tt-query {
            box-shadow: 0 1px 1px rgba(0, 0, 0, 0.075) inset;
        }

        .tt-hint {
            color: #999999;
        }

        .tt-dropdown-menu {
            background-color: #FFFFFF;
            border: 1px solid rgba(0, 0, 0, 0.2);
            border-radius: 8px;
            box-shadow: 0 5px 10px rgba(0, 0, 0, 0.2);
            margin-top: 12px;
            padding: 8px 0;
            width: 422px;
        }

        .tt-suggestion {
            font-size: 24px;
            line-height: 24px;
            padding: 3px 20px;
        }

            .tt-suggestion.tt-is-under-cursor {
                background-color: #0097CF;
                color: #FFFFFF;
            }

            .tt-suggestion p {
                margin: 0;
            }
    </style>

和HTML代码：

<body>
    <div class="bs-example">
        <input type="text" class="typeahead tt-query" autocomplete="off" spellcheck="false">
    </div>
</body>

任何人都可以帮助我吗？

Twitter Typeahead与本地数据集

0 个答案: