Question

您好StackOverflow社区

我正在使用Django建立一个适合移动设备的网页。该页面包含一系列图像和一个按钮。单击该按钮时，应替换其中一个图像。

问题：我使用{％static＆＃39; img / Test1.jpg＆＃39; HTML中的％}标记。只有在页面加载时才能正确呈现。

<div class="container" id="top_container">
    <div class="row"> <!-- Major Row containing both the chat window and the autoring window -->
        <div class="col-lg-4 center-block">
            <h1>{{secretDisplay.secretTitle}}</h1>
                <div class="row">
                    <div class="col-ls-12 center-block" id="child"> <!-- Chat Window -->
                        <p contenteditable="true" class="chat_window" style="text-align:left">
                            <img src="{% static 'img/Test1.jpg'%}" class="icon_one"/><img src="{% static 'img/Test1.jpg'%}" class="icon_one"/><img src="{% static 'img/Test1.jpg'%}" class="icon_one"/><img src="{% static 'img/Test1.jpg'%}" class="icon_one"/><img src="{% static 'img/Test1.jpg'%}" class="icon_one"/><img src="{% static 'img/Test1.jpg'%}" class="icon_one"/><img src="{% static 'img/Test1.jpg'%}" class="icon_one"/><img src="{% static 'img/Test1.jpg'%}" class="icon_one"/><img src="{% static 'img/Test1.jpg'%}" class="icon_one"/><img src="{% static 'img/Test1.jpg'%}" class="icon_one"/>
                        </p>
                    </div>
                </div>
                <div> <!-- This is where we will author the messages -->
                    <p contenteditable="true" class="col-ls-12 center-block write_window author_box">This is the test</p>
                </div>
        </div>
     </div>
</div>

我想使用jQuery替换第一个图像，但是下面的代码不起作用，因为Django只呈现{％static＆＃39; img / Test2.jpg＆＃39; ％} on page-load。

$(document).ready( function() {
    $("#about-btn").click( function(){
        $('.chat_window img').attr("src","{% static 'img/Test2.jpg'%}");
    });
});

是否有一种优雅的方式可以动态替换图像而无需为绝对路径提供jQuery？

任何建议都将受到高度赞赏！

谢谢中号

Answer 1

Django只在页面加载时呈现{％static'img / Test2.jpg'％}。

Django在页面加载时执行不渲染模板。 Django在页面加载之前呈现它。

如果您已经知道要粘贴的路径，则不需要Django静态标记：

$("#about-btn").click( function(){
    $('.chat_window img').attr("src","img/Test2.jpg");
});

用jQuery替换Django中的图像

1 个答案: