使用FlaskBootstrap时，在jqueryui之前加载jquery

Question

我需要为jquery的autocomplete函数加载jquery ui，而flaskbootstrap没有这个功能。我用这行代码将它添加到模板中

<script src="http://code.jquery.com/ui/1.11.2/jquery-ui.js" ></script>

但是，我让烧瓶引导加载jquery.js，它总是在模板加载jquery ui之后加载它，因此jqueryui失败，因为它要求首先加载jquery。在

^{pr2}$

为了暂时解决这个问题，我修改了flaskbootstrap的__init.py__，以防止它加载jquery，并手动将其加载到模板中。这个页面正常工作，但是其他页面都停止工作，因为jquery不再加载了。在

有没有办法确保flask引导程序先加载jquery，然后让模板加载jquery ui或flask bootstrap加载jquery ui本身？在

{% extends "base.html" %}
{% import "bootstrap/wtf.html" as wtf %}

{% block head %}
    {{ super() }}
    <link href="http://code.jquery.com/ui/1.10.2/themes/smoothness/jquery-ui.css" rel="Stylesheet"></link>
    <script src="http://code.jquery.com/ui/1.11.2/jquery-ui.js" ></script>
{% endblock %}

{% block title %}Project-Z{% endblock %}

{% block page_content %}
<div class="page-header">
    <h1> Members list </h1>
    <h2>Find a member</h2>
    <br>
    <div class="col-md-4">
        {{ wtf.quick_form(form) }}
    </div>
</div>

<script type="text/javascript">
    $(function() {
        $( "#member_name" ).autocomplete({
            source: '{{url_for("main.autocomplete")}}',
            minLength: 2,
        });
    });
</script>
{% endblock %}

Answer 1

我没有把脚本放在头上，而是把它放在脚本部分，这样它就可以在序列中稍后加载。这样，在烧瓶引导之后它可以正确加载jquery.js荷载。http://pythonhosted.org/Flask-Bootstrap/faq.html#how-can-i-add-custom-javascript-to-the-template

{% block scripts %}
  {{super()}}
   <script src="http://code.jquery.com/ui/1.11.2/jquery-ui.js" ></script>
{% endblock %}