Почему мой JavaScript не работает, когда я помещаю свой HTML в «include»?

Question

{% include "abc.html" %}

В Django я поместил свой html в это.

Теперь мой javascript не будет работать.

$(function(){
   alert('hi');
   $(".div_inside_abc").css("background","#000");

});

Я даже пытался поместить этот javascript в abc.html(на вершине).Это все равно не будет работать.

Когда я это сделаю:

$(".div_inside_abc").each(function(e){
    document.write($(this).attr("data-rel"));
});

Я получаю это:

{{p.grid_image_ur l}}{{p.grid_image_ur l}}{{p.grid_image_ur l}}{{p.grid_image_ur l}}{{p.grid_image_ur l}}{{p.grid_image_ur l}}

Это не нормально!Как будто шаблон Django не рендерится, когда я что-то «включаю».

Answer 1

Если вы поместите код JavaScript в HTML, он не будет выполняться (или не будет действительным HTML). Вы должны обернуть его в тег SCRIPT , если вы собираетесь сделать это таким образом (что я не советую) или в качестве атрибута DOM1.

Если вы хотите, чтобы jQuery запускал эту функцию при загрузке, я бы предложил сделать это в файле JavaScript с внешней ссылкой, который загружается после jQuery,

$(document).ready(function() {
    alert('hi');
    $(".div_inside_abc").css("background","#000");
});

Или добавив его как

<script language="javascript">
    $(document).ready(function() {
        alert('hi');
        $(".div_inside_abc").css("background","#000");
});
</script>

после включения jQuery.

Если вы хотите, чтобы это оценивалось произвольно, я бы предложил вызывать функцию напрямую таким образом (если вам нужна область действия)

(function(){
    alert('hi');
    $(".div_inside_abc").css("background","#000");

})();

Answer 2

В abc.html измените {{p.grid_image_ur l}} на {{p.grid_image_url}}.Может и не так, но это хорошее начало.Страница должна выдавать ошибку, которую по какой-то причине вы не видите.