使用Django的web形式的树视图结构
我想使用Django在树状视图中创建一个webform。我对它完全陌生，无法理解如何制作它 我在html中尝试了以下代码使用Django的web形式的树视图结构,django,Django,我想使用Django在树状视图中创建一个webform。我对它完全陌生，无法理解如何制作它 我在html中尝试了以下代码 <!DOCTYPE html> <html> <head> <meta name="viewport" content="width=device-width, initial-scale=1"> <style> ul, #myUL { list-style-type: none; } #myUL { ma
<!DOCTYPE html>
<html>
<head>
<meta name="viewport" content="width=device-width, initial-scale=1">
<style>
ul, #myUL {
list-style-type: none;
}
#myUL {
margin: 0;
padding: 0;
}
.caret {
cursor: pointer;
-webkit-user-select: none; /* Safari 3.1+ */
-moz-user-select: none; /* Firefox 2+ */
-ms-user-select: none; /* IE 10+ */
user-select: none;
}
.caret::before {
content: "\25B6";
color: black;
display: inline-block;
margin-right: 6px;
}
.caret-down::before {
-ms-transform: rotate(90deg); /* IE 9 */
-webkit-transform: rotate(90deg); /* Safari */'
transform: rotate(90deg);
}
.nested {
display: none;
}
.active {
display: block;
}
</style>
</head>
<body>
<h2>Tree View</h2>
<p>A tree view represents a hierarchical view of information, where each item can have a number of subitems.</p>
<p>Click on the arrow(s) to open or close the tree branches.</p>
<ul id="myUL">
<li><span class="caret">Beverages</span>
<ul class="nested">
<li>Water</li>
<li>Coffee</li>
<li><span class="caret">Tea</span>
<ul class="nested">
<li>Black Tea</li>
<li>White Tea</li>
<li><span class="caret">Green Tea</span>
<ul class="nested">
<li>Sencha</li>
<li>Gyokuro</li>
<li>Matcha</li>
<li>Pi Lo Chun</li>
</ul>
</li>
</ul>
</li>
</ul>
</li>
</ul>
<script>
var toggler = document.getElementsByClassName("caret");
var i;
for (i = 0; i < toggler.length; i++) {
toggler[i].addEventListener("click", function() {
this.parentElement.querySelector(".nested").classList.toggle("active");
this.classList.toggle("caret-down");
});
}
</script>
</body>
</html>
ul，#myUL{
列表样式类型：无；
}
#密尔{
保证金：0；
填充：0；
}
插入符号{
光标：指针；
-webkit用户选择：无；/*Safari 3.1+*/
-moz用户选择：无；/*Firefox 2+*/
-ms用户选择：无；/*IE 10+*/
用户选择：无；
}
插入符号：之前{
内容：“\25B6”；
颜色：黑色；
显示：内联块；
右边距：6px；
}
.caret down：：之前{
-ms变换：旋转（90度）；/*IE 9*/
-webkit变换：旋转（90度）；/*Safari*/'
变换：旋转（90度）；
}
.嵌套{
显示：无；
}
.主动{
显示：块；
}
树视图
树状视图表示信息的层次视图，其中每个项可以有多个子项
单击箭头以打开或关闭树枝
- 饮料
- 水
- 咖啡
- 茶
- 红茶
- 白茶
- 绿茶
- 森查
- Gyokuro
- 抹茶
- 皮洛春
var-toggler=document.getElementsByClassName（“插入符号”）；
var i；
对于（i=0；i但是如何在Django制作呢？需要表示相同的内容。尝试了一些github示例，但未能成功获取。有人能给我举个简单的例子吗首先，你可以使用语义UI或引导之类的框架。这会更容易。 在您的情况下，您可以将任何