0

我正在开发 DjangoCMS 应用程序,其中包括其自定义 javascript 文件,但在使用 templatetag render_block 后使用 jQuery 时出现问题。

创建一个新项目后,这里是我的项目结构:

project/
    apps/
        myapp/
    static/
        js/
            custom.js
    templates/
        base.html
        header.html
        menu.html
    __init__.py
    settings.py
    urls.py

base.html

{% load cms_tags menu_tags sekizai_tags staticfiles %}
<!DOCTYPE html>
<html>
<head>
    <title>{% block title %}This is my new project home page{% endblock title %}</title>
</head>
<body>
    <div>
        {% include "header.html" %}
        {% show_menu 0 100 100 100 "menu.html" %}
     </div>
    {% block content %}{% endblock content %}
    {% render_block "js" %}
    {% addtoblock 'js' %}
         <script type='text/javascript' src="{% static "js/bootstrap.min.js" %}"></script>
         <script type='text/javascript' src="{% static "js/custom.js" %}"></script>
    {% endaddtoblock 'js' %}
</body>
</html>

项目/应用程序/myapp/模板/myapp/home.html

{% extends CMS_TEMPLATE %}
{% load cms_tags sekizai_tags staticfiles %}

{% block title %}Home{% endblock title %}
{% block content %}{% endblock content %}

home.html中还没有内容。但是 base.html 中的内容可以正确呈现。问题出在使用 jQuery的custom.js中。

自定义.js

$(document).ready(function(){
    alert("Hi");
});

警报消息永远不会弹出,我收到消息"undefined is not a function"困扰我的主要问题是 jQuery 包含在我的源代码中,但我不能使用它。

源代码

<html>
...
<body>
    ....
    <script>
    var _jQuery = window.jQuery || undefined;
    var _$ = window.$ || undefined;
    </script>
    <script src="/static/cms/js/libs/jquery.min.js"></script>
    <script src="/static/cms/js/libs/class.min.js"></script>
    <script src="/static/cms/js/modules/jquery.ui.custom.js"></script>
    <script src="/static/cms/js/modules/jquery.ui.nestedsortable.js"></script>
    <script src="/static/cms/js/modules/cms.base.js"></script>
    <script src="/static/cms/js/modules/cms.modal.js"></script>
    <script src="/static/cms/js/modules/cms.sideframe.js"></script>
    <script src="/static/cms/js/modules/cms.clipboard.js"></script>
    <script src="/static/cms/js/modules/cms.plugins.js"></script>
    <script src="/static/cms/js/modules/cms.structureboard.js"></script>
    <script src="/static/cms/js/modules/cms.toolbar.js"></script>
    ...
    <script type='text/javascript' src="/static/js/custom.js"></script>
</body>
</html>

显然 {% render_block "js" %} 工作正常,但我发现正因为如此,CMS.$ 将被传递为 $。因此,我补充说:

<script> $ = CMS.$ </script> 

在我的顶部addtoblock

{% addtoblock 'js' %}
    <script>$=CMS.$</script>
    <script type='text/javascript' src="{% static "js/bootstrap.min.js" %}"></script>
    <script type='text/javascript' src="{% static "js/custom.js" %}"></script>
{% endaddtoblock 'js' %}

我的警报问题已解决,但 Bootstrap 仍然报告说没有 jQuery:

Bootstrap 的 JavaScript 需要 jQuery

添加 jQueryaddtoblock可以解决问题,但是我的源代码中会有两个相同的 jQuery 文件,这是不必要的。我在这里想念什么?

4

1 回答 1

1

快速浏览一下 bootstrap 源代码告诉我他们会检查jQuery,而不是$. 尝试将您的更改<script>$ = CMS.$</script><script>jQuery = CMS.$</script>.

但是,请注意只有在工具栏处于活动状态时才会加载 CMS jQuery,例如,仅适用于已登录的员工用户。

于 2014-11-10T15:00:54.807 回答