1

尝试提前输入以在烧瓶中工作，即使是最简单的代码（遵循本教程）也不会响应选项列表/突出显示的可能项目。

我只有来自烧瓶 main.py 的 render_template 调用，相应的 HTML 如下所示：

<html>
<head>
    <script src="{{ url_for('static',filename='jquery.js') }}"></script>
    <link href="{{ url_for('static',filename='bootstrap.css') }}" rel="stylesheet" type="text/css" />
    <script src="{{ url_for('static',filename='typeahead.js') }}"></script>
</head>
<body>

    <div style="margin: 50px 50px">
        <label for="product_search">Product Search: </label>
        <input id="product_search" type="text" data-provide="typeahead" data-source='["Deluxe Bicycle", "Super Deluxe Trampoline", "Super Duper Scooter"]'>
    </div>

</body>

这段代码可能是使用本地数据源的最简单的实现。注意-我尝试更改脚本初始化顺序（首先是 jquery，首先是 bootstrap.css，等等），但这没有帮助。

Flask/Typeahead 是否存在任何已知问题？知道我错过了什么吗？

4

1 回答 1

0

我自己已经有一段时间没有使用预输入了，但是我注意到教程和您的代码之间的区别是本教程在预输入输入之后加载脚本。如此：

<html>
<head>
    <script src="{{ url_for('static',filename='jquery.js') }}"></script>
    <link href="{{ url_for('static',filename='bootstrap.css') }}" rel="stylesheet" type="text/css" />
</head>
<body>

    <div style="margin: 50px 50px">
        <label for="product_search">Product Search: </label>
        <input id="product_search" type="text" data-provide="typeahead" data-source='["Deluxe Bicycle", "Super Deluxe Trampoline", "Super Duper Scooter"]'>
    </div>

    <script src="{{ url_for('static',filename='typeahead.js') }}"></script>

</body>

如果这也不起作用，请尝试使用 JS 手动触发 typeahead，如Bootstrap 网站上所示

<html>
<head>
    <script src="{{ url_for('static',filename='jquery.js') }}"></script>
    <link href="{{ url_for('static',filename='bootstrap.css') }}" rel="stylesheet" type="text/css" />
    <script src="{{ url_for('static',filename='typeahead.js') }}"></script>
</head>
<body>

    <div style="margin: 50px 50px">
        <label for="product_search">Product Search: </label>
        <input id="product_search" type="text" data-provide="typeahead" data-source='["Deluxe Bicycle", "Super Deluxe Trampoline", "Super Duper Scooter"]'>
    </div>

    <script type="text/javascript">
      $('#product_search').typeahead()
    </script>

</body>
于 2013-09-02T19:57:13.280 回答