1

Symfony2 のドキュメントで読むことができるように、JavaScript ファイルは body タグの下部で宣言する必要があります。

ただし、レイアウト テンプレートで jQuery ライブラリを宣言し、子テンプレートで jQuery を使用する場合、次のエラーが発生します。

$ が定義されていません

script タグの後に jQuery がロードされているようです。jQueryファイルの先頭にアラートメッセージを入れると、アラートが表示されます。

前にjQueryをロードするアイデアはありますか?

私のベース、レイアウト、および子テンプレートの下を見つけてください。

app/Resources/views/layout.html.twig:

<html>
    <head>
        <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
        {% block stylesheets %}
                {# ... #}
        {% endblock %}
    </head>

    <body>            
        <div id="container">
            {# ... #}
        </div>

        {% block javascripts %}
        {% endblock %}
    </body>
</html>

src/MyBundle/resources/views/layout.html.twig:

{% extends "::layout.html.twig" %}

{% block main %}
    {% block mybundle_body %}
    {% endblock %}
{% endblock %}

{% block javascripts %} 
    {% javascripts
        '@MyBlogBundle/Resources/public/js/jquery-1.8.3.min.js' %}
        <script src="{{ asset_url }}"></script>
    {% endjavascripts %}
{% endblock javascripts %}

src/MyBundle/resources/views/MyBundle/modify.html.twig:

{% extends "MyBundle::layout.html.twig" %}

{% block mybundle_body %}

    <script type="text/javascript">
    // Enable the file uploader
    $(function() { // my error here : $ is not defined
        new PunkAveFileUploader({ 
            {# ... #}
        });
    });
    </script>
{% endblock %}

どうもありがとう。

4

2 に答える 2

4

さて、あなたが言ったように、jQuery はタグの後にロードされるため、スクリプトが jQuery (記号付き) を使用しようとすると、jQuery はまだ定義されていません。<script>$

{% block javascripts %}をhead タグに移動します。

于 2013-01-08T07:55:20.023 に答える
2

新しい継承を構築できます。したがって、スクリプトは常に jQuery の後に配置されます。

{% block javascripts %} 
    {% javascripts
        '@MyBlogBundle/Resources/public/js/jquery-1.8.3.min.js' %}
        <script src="{{ asset_url }}"></script>
    {% endjavascripts %}
    {% block script %}
    {% endblock script %}
{% endblock javascripts %}

src/MyBundle/resources/views/MyBundle/modify.html.twig:

{% extends "MyBundle::layout.html.twig" %}

{% block mybundle_body %}
   //some stuff
{% endblock %}

{% block script %}

<script type="text/javascript">
    // Enable the file uploader
    $(function() { // my error here : $ is not defined
        new PunkAveFileUploader({ 
            {# ... #}
        });
    });
    </script>
{% endblock %}
于 2013-01-08T09:04:43.327 に答える