У меня есть шаблон base.html , который наследуется другим шаблоном (т. Е. user_profile.html page), например: {% extends "base.html" %}
Проблема в том, что библиотека jquery видна только для шаблона base.html . Код внутри jQuery(document).ready(function()), который находится внутри шаблона user_profile.html , не запускается.
Если поместить второй тег импорта библиотеки jQuery в шаблон user_profile.html , его собственный jQuery в функции ready () будет работать нормально, но тогда база .html не может видеть свой собственный код jQuery ready () (хотя там также есть начальный тег импорта).
Вот что я использую: <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.4.4/jquery.min.js"></script>
(Надеюсь, что все вышесказанное имеет смысл.)
Что я делаю не так?
-EDIT-
это base.html
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en-GB">
<head>
<title>{% block title %} {% endblock %}</title>
<!-- remote apis first -->
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.4.4/jquery.min.js"></script>
<script src="http://cdn.jquerytools.org/1.2.5/full/jquery.tools.min.js"></script>
<!-- then local -->
<script src="/site_media/js/ui/jquery.ui.core.js"></script>
<script type="text/javascript">
jQuery(document).ready(function(){
alert('it works!'); //this alert popups normally
});
</script>
{% block external %} {% endblock %}
</head>
<body id="body">
<div id="wrap">
<!-- same stuff for all templates is going on here -->
<div id="content">
<!-- main content area, different for each template-->
<div class="main">
{% block maincontent %} {% endblock %}
</div>
</div>
</div> <!-- wrapper -->
{etc...}
Это user_profile.html
{% extends "base.html" %}
{% load my_tags %}
{% block title %}User Home{% endblock %}
<!-- following block is inside the <head> of the base.html -->
{% block external %}
<link rel="stylesheet" href="/site_media/css/maps.css" type="text/css" media="screen" />
<script type="text/javascript">
jQuery(document).ready(function(){
alert('hi!'); // it is never reached!
});
</script>
{% endblock %}
{% block maincontent %}
<!-- stuff is going on here -->
{% endblock %}