7

所以我正在研究一个 Django 项目,并试图弄清楚如何让 Javascript 能够从我的静态目录中渲染图像。我已修改我的 settings.py 以从 myproject/static 加载静态文件(图像、js 等),并从 myproject/templates 加载我的模板。现在在每个模板的顶部,我有以下行:

{% load staticfiles %}

这允许我在模板中加载这样的图像:

<img src="{% static "images/someImage.jpg" %}" width="65" height="36" alt="SomeImage"/>

现在,这工作得很好 - 图像加载并按预期显示在页面上。但是我正在尝试这样做(好吧,无论如何,我的队友是):

<p><script src="{% static "js/getHeader.js" %}" type="text/javascript"></script></p>

此行与上述两行位于同一文件中。getHeader.js 文件:

var time = new Date();
var month = time.getMonth();
var day = time.getDate();
var year = time.getFullYear();

if (month == 1 & day == 23 & year == 2013) {
  document.write('<img src="{% static "images/anotherImage.png" %}" width="680" height="210" />');
} else {
  document.write('<img src="{% static "images/yetAnotherImage.png" %}" width="680" height="210"/>');
}

澄清一下,这个想法是在某个预定义的日期打印不同的标题。出于明显的原因,我试图将任何图像/html与渲染模板的 Python 代码分开,所以我不想只将图像名称作为参数传递。代码本身运行良好,但是当页面加载时会出现 alt 名称,但图像本身不会;只是那些通用的空“找不到图像”框之一。

可能值得一提的是,如果我将此 Javascript 内联到图像呈现的实际 HTML 页面中,效果会很好。这也是在开发环境中,而不是在生产环境中——我将在以后处理这个问题。

是什么赋予了?我想,既然该行应该写入包含上述“加载静态文件”行的文档,那么图像只会与 HTML 的其余部分一起呈现。任何有关如何解决此问题或以不同方式完成此问题的建议将不胜感激!

4

1 回答 1

12

getHeader.js与 django 没有任何关系。它只是浏览器正在加载的文本文件。因此它不知道像 {% static %} 或 {{ foo }} 这样的 django 语法。

有几种方法可以解决这个问题。一种常见的方法是定义一个全局 javascript 变量,STATIC_URL您可以在以后的 JS 文件中引用该变量。

<script type="text/javascript">
    DJANGO_STATIC_URL = '{{ STATIC_URL }}';
</script>

另一种是使用类似的东西Django Compressor可以通过django的模板系统渲染JS。 https://github.com/jezdez/django_compressor

于 2013-07-27T01:22:17.230 回答