Question

我在twig视图中有这个代码：

{% extends "MyBundleBundle::layout.html.twig" %}
{% block content %}
    <div class="page-header">
        <h4>add an equipement</h4>
    </div
    <select id="selectEquipement">
          <option selected disabled>choose an equipement</option>
          <option value="{{ path('addEquipement1') }}">Equipement 1</option>
          <option value="{{ path('addEquipement2') }}">Equipement 2</option>
    </select>

    <div id="formEquipement"></div>

    <script type="text/javascript">
        $(document).ready(function() {
            $('#selectEquipement').change(function() {
                var url = $(this).val();
                $.get(url , {} , function(formulaire)  {
                    $("#formEquipement").html(formulaire);
                    })
                })
        });
    </script>
{% endblock %}

当我加载此视图的页面内容时，我的脚本$(document).ready(function() {的第一行出现此错误：

未捕获的ReferenceError：$未在树枝模板中定义

我知道jQuery不是加载。当我在此视图上添加<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>此标记时，一切正常，我没有错误。

但实际上我已经在我的应用程序（本地）中导入了我需要的 jquery脚本。所以在我的主要布局中，我已经导入了这样的脚本：

{% block script %}
                {% javascripts

                                '@MySpaceMyBundle/Resources/public/js/jquery-2.1.1.min.js'
                                '@MySpaceMyBundle/Resources/public/js/jquery-ui.min.js'
                                '@MySpaceMyBundle/Resources/public/js/bootstrap.min.js'
                                '@MySpaceMyBundle/Resources/public/js/applydataTables.js'
                                '@MySpaceMyBundle/Resources/public/js/jquery.form.min.js'
                                '@MySpaceMyBundle/Resources/public/js/jquery.dataTables.min.js'
                                '@MySpaceMyBundle/Resources/public/js/dataTables.colVis.min.js'
                                '@MySpaceMyBundle/Resources/public/js/jquery.sumoselect.min.js'
                                '@MySpaceMyBundle/Resources/public/js/main.js'
                                'http://cdn.datatables.net/responsive/1.0.3/js/dataTables.responsive.js'%}
                                <script type="text/javascript" src="{{ asset_url }}"></script>
                {% endjavascripts %}
            {% endblock %}

有人知道为什么吗？我注意到我有一些错误，因为我升级我的symfony应用程序到2.6版本。

此外，当我在我的应用程序中使用 Ajax 调用时，在 symfony工具栏中，Ajax请求的通知不像以前那样工作（没有通知），但是当我在浏览器的网络标签中进行调试一切正常。

Answer 1

尝试更换：

$(document).ready(function() {

与

$(window).load(function() {

当所有元素（包括动态生成的元素（或已包含））都已加载时，

window.onload()会在document.ready()之后触发。

编辑：您可以尝试在jQuery代码之后在页脚中移动代码吗？

正确的方法是在jQuery之后有一个单独的.js文件并在页脚中调用它。

未捕获的ReferenceError：$未在带有jQuery导入的twig模板中定义

1 个答案: