gpt4 book ai didi

Javascript 不适用于 Django 模板继承

转载 作者:行者123 更新时间:2023-11-28 16:19:44 27 4
gpt4 key购买 nike

我在使 Javascript 与 Django 模板继承一起使用时遇到一些问题。根据 Opera 的说法,所有 javascript 及其 CSS 文件都可以正常加载,但 Javascript 不起作用,而不是显示 Javasrcript 表,而是显示普通的 html 表格。如果我从 child 中删除所有继承标签,一切都会正常。

我一直在使用 Dreamweaver 来制作这些文件,但我怀疑这是否对这个问题有任何实际效果。

父级 - base.html header :

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>Untitled Document</title>
<link href="/SpryAssets/css/base_new.css" rel="stylesheet" type="text/css"><!--[if lte IE 7]>
<style>
.content { margin-right: -1px; }
ul.nav a { zoom: 1; }
</style>
<![endif]-->
<style type="text/css">
.item_table_main { border-top-width: 0px;
border-right-width: 0px;
border-bottom-width: 0px;
border-left-width: 0px;
border-top-style: none;
border-right-style: none;
border-bottom-style: none;
border-left-style: none;
}
</style>
</head>

<body>

子标题:

{% extends "base_new.html" %}

<!DOCTYPE HTML>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>Untitled Document</title>
<style type="text/css">
{% block css %}
body table tr {
font-family: Arial, Helvetica, sans-serif;
font-size: 14px;
background-color: #FFF;
border: 0px none #FFF;
}
</style>
<script src="/SpryAssets/SpryTabbedPanels.js" type="text/javascript"></script>
<script src="/SpryAssets/SpryCollapsiblePanel.js" type="text/javascript"></script>
<link href="/SpryAssets/SpryTabbedPanels.css" rel="stylesheet" type="text/css">
<link href="/SpryAssets/SpryCollapsiblePanel.css" rel="stylesheet" type="text/css">
<style type="text/css">
#apDiv1 {
position:absolute;
width:382px;
height:252px;
z-index:1;
left: 1169px;
top: 616px;
}
#apDiv2 {
position:absolute;
width:1575px;
height:138px;
z-index:2;
}
{% endblock css %}
</style>
</head>

这似乎与标题没有任何关系。 Dreamweaver 在 child.html 末尾生成此脚本

<script type="text/javascript">
var TabbedPanels1 = new Spry.Widget.TabbedPanels("TabbedPanels1");
var CollapsiblePanel9 = new Spry.Widget.CollapsiblePanel("CollapsiblePanel9", {contentIsOpen:false});
var CollapsiblePanel8 = new Spry.Widget.CollapsiblePanel("CollapsiblePanel8", {contentIsOpen:false});
var CollapsiblePanel6 = new Spry.Widget.CollapsiblePanel("CollapsiblePanel6",
</script>

我未能将其包含到内容 block 中 - 我花了半天时间才弄清楚;p。

感谢大家的帮助。

最佳答案

如果您要扩展模板,则需要定义它将在父模板中覆盖的 block 。您发布的子模板具有未包含在 {% block %} 模板标签内的标记。

如果您想更改文档的整个结构,则不需要模板继承。

有关模板继承的更多信息:https://docs.djangoproject.com/en/dev/topics/templates/#template-inheritance

此外,一些来自其他框架/语言的人习惯于inclusion作为重用的主要机制。您可能想看看这是否更适合您的需求。

编辑:我继续编辑了您的模板,以便它们具有适当的 block 。

base.html

{% block doctype %}<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">{% endblock %}
<html>

{% block head %}
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>Untitled Document</title>
<link href="/SpryAssets/css/base_new.css" rel="stylesheet" type="text/css"><!--[if lte IE 7]>
<style>
.content { margin-right: -1px; }
ul.nav a { zoom: 1; }
</style>
<![endif]-->
<style type="text/css">
.item_table_main { border-top-width: 0px;
border-right-width: 0px;
border-bottom-width: 0px;
border-left-width: 0px;
border-top-style: none;
border-right-style: none;
border-bottom-style: none;
border-left-style: none;
}
</style>
</head>
{% endblock %}

<body>

{% block content %}

{# base content here #}

{% endblock %}

</body>
</html>

child.html

{% extends "base.html" %}

{% block doctype %}<!DOCTYPE HTML>{% endblock %}

{% block head %}

<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>Untitled Document</title>
<style type="text/css">
{% block css %}
body table tr {
font-family: Arial, Helvetica, sans-serif;
font-size: 14px;
background-color: #FFF;
border: 0px none #FFF;
}
</style>
<script src="/SpryAssets/SpryTabbedPanels.js" type="text/javascript"></script>
<script src="/SpryAssets/SpryCollapsiblePanel.js" type="text/javascript"></script>
<link href="/SpryAssets/SpryTabbedPanels.css" rel="stylesheet" type="text/css">
<link href="/SpryAssets/SpryCollapsiblePanel.css" rel="stylesheet" type="text/css">
<style type="text/css">
#apDiv1 {
position:absolute;
width:382px;
height:252px;
z-index:1;
left: 1169px;
top: 616px;
}
#apDiv2 {
position:absolute;
width:1575px;
height:138px;
z-index:2;
}
{% endblock css %}
</style>
</head>

{% endblock %}

{% block content %}

{# child content here #}

{% endblock %}

</body>
</html>

关于Javascript 不适用于 Django 模板继承,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/10145325/

27 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com