Блог

Главная - Вопросы по программированию - Как извлечь изображение из статической папки с помощью javascript и django

Как извлечь изображение из статической папки с помощью javascript и django

#javascript #python #django

Вопрос:

У меня возникли проблемы при попытке получить изображение из статической папки. Когда я передаю изображение в html, оно работает. вот мой код

 <div id="dirs" class="card mb-3" style="max-width: 540px;">
    <div class="row no-gutters">
        <div class="col-md-4">
        <img src="{% static 'PERDNI/09401576.jpg' %}" class="card-img" alt="..."/>
        </div>
        <div class="col-md-8">
            <div class="card-body">
                <h5 class="card-title">Datos personales</h5>
                <p class="card-text">This is a wider card.</p>
            </div>
        </div>
    </div>
</div>

Это сгенерированный html — код в инспекторе браузера:
введите описание изображения здесь

С другой стороны, когда я генерирую html из файла javascript, он не работает, изображение не отображается, но другая часть html да. Вот мой код

 var datahtml='<div class="row no-gutters"><div class="col-md-4">';
datahtml ='<img src="{% static '
datahtml ="'PERDNI/09401576.jpg'"
datahtml =' %}" class="card-img" alt="My image"/>'
datahtml ='</div><div class="col-md-8"><div class="card-body">'
datahtml ='<h5 class="card-title">Card title</h5>'
datahtml ='<p class="card-text">Hello</p>'
datahtml ='</div></div></div>'
document.getElementById("dirs").innerHTML=datahtml

Это другой сгенерированный html — код в инспекторе браузера:
введите описание изображения здесь

В чем будет проблема, я думал в кавычках, однако я пытался многими способами, и это еще не сработало. Заранее спасибо.

Комментарии:

1. То, что вы видите в первом сгенерированном html-файле, — это содержимое, возвращаемое вашим внутренним кодом django после рендеринга вашего шаблона. В вашем коде javascript (на стороне клиента или на стороне сервера используется что-то вроде node.js?), html, который вы создаете, использует шаблон html, который не должен

2. попробуй вот так datahtml ='<img src="{% static 'PERDNI/09401576.jpg' %}" >'

3. Я попробовал datahtml ='<img src=»{% статический «PERDNI/09401576.jpg’%} » > ‘ однако это не сработало. В любом случае, большое вам спасибо.

4. код {% static .. %} -это код на Python, и он не может работать в JavaScript. В JavaScript вы должны использовать напрямую /static/PERDNI/09401576.jpg . В конце концов, вы могли бы использовать {% static .. %} Python (используя шаблоны Django) для создания файла с помощью JavaScript — и тогда этот файл будет иметь /static/PERDNI/09401576.jpg

Метки: