如何在javascript代码中的图像位置在Django模板

我使用的JavaScript文件做一些按钮显示。当用户点击一个按钮，当前按钮的图像被替换为另一个图像（从而创建的效果一个新的按钮代替旧的按钮），反之亦然。我创建了一个id ='imgbutton'的<img>元素，并使用元素attr('src',newimage)来显示这些按钮。如何在javascript代码中的图像位置在Django模板

我把JavaScript文件中{{MEDIA_URL}}/js目录sothat文件可以被添加到使用

<script type="text/javascript" src="{{MEDIA_URL}}/js/myscript.js" ></script>

在JavaScript代码（jQuery的1.7.1）的模板，我设置的图像这样

.. 
var btnimg=$('#imgbutton'); 
btnimg.attr('src','{{MEDIA_URL}}/img/NewImage.png');

这会导致在javascript控制台中有一个404 error ..并显示一个占位符而不是图像。在Django模板中，{{MEDIA_URL}}/img/OldImage.png正确显示..它只是在问题发生的JavaScript。可以帮助我找出为什么会发生这种情况？我该如何纠正？

来源

2012-04-15 damon

你的问题是，JS文件没有被Django的模板引擎处理。当我需要这样做时，我通常会直接在页面中放置一小部分JS来设置变量值，然后通过使用<link>标记加载的JS文件来引用它。

更新：

是的，你想要做这样的事情：

<script> 
// first set the value you will be using. 
var MEDIA_URL = "{{MEDIA_URL}}"; // and anything else you need to set 
</script> 

<script type="text/javascript" src="{{MEDIA_URL}}/js/myscript.js" ></script>

现在你可以引用全球价值内 JS文件，如：

btnimg.attr('src',MEDIA_URL+'/img/NewImage.png');

如果有很多这些东西，保存所有这些东西的数组或对象保持你的nam保持整洁。

来源

2012-04-15 16:09:56

是否意味着媒体url字符串应该被捕获到一个变量中并传递给设置图像的javascript代码？ – damon 2012-04-15 16:16:37

它不被“传递”给代码。它只是在全球范围内设置;然后其他码位使用它。 – Dor 2012-04-15 18:28:16

感谢@Peter的详细解答 – damon 2012-04-15 18:29:43

如何在javascript代码中的图像位置在Django模板

回答

相关问题