Question

所以我正在研究一个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页面中，那么图像渲染就可以了。这也是在开发环境中，而不是生产 - 我将在后面处理这个问题。

是什么给出的？我认为既然该行应该写入包含上述'load staticfiles'行的文档，那么图像将只用HTML的其余部分呈现。任何关于如何解决这个问题或以不同方式完成它的建议都将非常感谢！

Answer 1

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

从Django中的Javascript引用静态图像

1 个答案: