如何使用django从javascript函数的静态文件加载图像

当试图从静态文件中获取图片时，我遇到了一个问题，但是从javascript finction中获取图片时

以下是我的javascript代码：

<script type="text/javascript">
    var url_1 = '{% static "assets/img/stolovi/2.jpg" %}';

    function addimage1() {
        var img = document.createElement("img");
        img.src = url_1;
        img.height = 50;
        img.width = 50;
        img.draggable = true;
        //optionally set a css class on the image
        var class_name = "foo";
        img.setAttribute("class", class_name);

        document.getElementById("myDiagramDiv").appendChild(img);
        //document.body.appendChild(img);
        $(img).draggable({containment:'#myDiagramDiv'});
        }
</script>

var url_1=“{%static”assets/img/stolovi/2.jpg”%}”；
函数addimage1（）{
var img=document.createElement（“img”）；
img.src=url_1；
img.高度=50；
img.width=50；
img.draggable=true；
//可以选择在图像上设置css类
var class_name=“foo”；
img.setAttribute（“类”，类名称）；
document.getElementById（“myDiagramDiv”）.appendChild（img）；
//文件.正文.附件（img）；
$（img）.draggable（{containment:'#myDiagramDiv'}）；
}

如何在addimage1函数中获取该图片并将其设置为img.src

---

我的脚本标记在html标记中，我不知道这是否重要。

因此，在大多数情况下，您的代码工作正常。我想你可能对你试图使用的图书馆有问题。下面是一个类似的工作示例

var url_1='1〕https://www.gravatar.com/avatar/1d42ea6e005a4160211f7b1957ce0a09/?default=&s=64';
函数addimage1（）{
var img=document.createElement（“img”）；
img.src=url_1；
img.高度=50；
img.width=50；
//可以选择在图像上设置css类
var class_name=“foo”；
img.setAttribute（“类”，类名称）；
document.getElementById（“myImage”）.appendChild（img）；
}
addimage1（）；

是的，可以，但我想从静态文件中获取图片。您的静态文件是否正常工作？模板顶部是否有{%load staticfiles%}？如果是这样，就没有理由不能使用django静态方式分配javascript图像变量。var url_1=“{%static”assets/img/stolovi/2.jpg”%}”；我会检查并查看静态关键字返回的url，看看是否有404文件未找到错误是的，所有文件都工作正常，但这一个不会。你有404吗，你检查控制台是否有javascript错误发生吗？是的，我有404，谢谢，我不知道去哪里看，解决了。

<div id="myImage">

</div>

<script>
var url_1 = 'https://www.gravatar.com/avatar/1d42ea6e005a4160211f7b1957ce0a09/?default=&s=64';

function addimage1() {
  var img = document.createElement("img");
  img.src = url_1;
  img.height = 50;
  img.width = 50;
  //optionally set a css class on the image
  var class_name = "foo";
  img.setAttribute("class", class_name);

  document.getElementById("myImage").appendChild(img);
}

addimage1();
</script>