javascript - Django、HTML、JS : <img src ="#"> work in HTML but in JS file not

Question

如果我打电话<img src="{% static "images/loader.gif" %}" alt="loader.gif"/>在 home.html 中，显示了 gif(所以这应该意味着它正确指向所需的文件夹)但是如果我尝试在 js 文件中调用它，出现损坏的图标 ( screenshot )。 是否有不同的方式来调用 JS 文件中的图像(与 Html 文件相比)？

我的情况:

home.html

    ...
    <script src="{% static 'js/conta.js' %}"> </script>

    <a href="{% url 'conta' %}" class="btn btn-primary" role="button" id="btnGo">GO</a><div id="loading"></div>
    ...

conta.js

    $('#btnGO').click(function(e) {
        e.preventDefault();  

        $(this)
            .removeClass('btn-primary')
            .addClass('btn-danger disabled') 
            .text('WAIT');

        $('#loading').html('<img src="static/images/loader.gif" alt="loader.gif"/> loading...');

                        $.get("/conta/", function() {       
                           alert("FINISH");                    



        $('#btnGo')
            .removeClass('btn-danger disabled')
            .addClass('btn-primary') 
            .text('GO');

        $('#loading').html(''); 


        });
    });
});

Answer 1

您的 .js 文件未由模板系统处理，因此模板标签在此处不起作用。使用图像的硬编码路径:

$('#loading').html(
         '<img src="/static/images/loader.gif" alt="loader.gif"/> loading...');