UL为什么要制造子弹？

Question

我有以下HTML/Jinja2代码：

<div class="controls" id="pos">{% if context.job_history %} {% for k in context.job_history %} {% for v in k %} {% if v == "job_title" %}
    <div class='job'>
            <h3>{{ k[v] }}</h3>

        <input name='job_title[]' type='hidden' class='form-control' value='{{ k[v] }}' />
        <ul class='control-group list-inline'>{% endif %} {% if v == "from_" %}
            <li>
                <input name='from[]' type='hidden' class='form-control' style='width:130px' value='{{ k[v]|replace("00:00:00", "")|replace("-", "/") }}' />{{ k[v]|replace("00:00:00", "")|replace("-", "/") }} &nbsp;&ndash;</li>{% endif %} {% if v == "current_position" %}
            <li>{{ k[v]==True and "Present" or "" }}</li>
        </ul>{% elif v == "to_" %}
        <li>
            <input name='to[]' type='hidden' style='width:130px' class='form-control' value='{{ k[v]|replace("00:00:00", "")|replace("-", "/") }}' />{{ k[v]|replace("00:00:00", "")|replace("-", "/") }}</li>
        </ul>{% endif %} {% if v == "industries" %}
        <ul class="nav nav-pills">
            <div align='center'>{% for industry in k[v] %}
                <li>    <a>{{ industry }}</a>

                </li>{% endfor %}
                <input type="hidden" value="{{ k[v]|join(" , ") }}" class="form-control" name="industries[]">
            </div>
        </ul>{% endif %} {% endfor %}
        <br />  <a href='#' class='delete btn btn-danger btn-xs'>Remove</a>

    </div>{% endfor %} {% endif %}</div>    

上面的代码生成了这个输出：

当我查看此代码段的来源时，它显示了一个空的列表元素：

<li> </li>  

我看不到它为什么这样做，我试图将</ul>标记移入if语句内外，就像上面的代码一样，我试图在结束if语句之前放置</ul>标记：

</ul>
{% endif  %}

我想念什么？ 为什么会这样？

更新：

因此，我对代码做了一些更改：

{% if context.job_history %}
{% for k in  context.job_history %}
{% for v in  k %}
<div class='job'>
    {% if v == "job_title"  %}
        <h3>{{ k[v] }}</h3>
        <input name='job_title[]' type='hidden' class='form-control' value='{{ k[v] }}' />
    {% endif %}
    {% if v == "from_" %}
        <input name='from[]' type='hidden' class='form-control' style='width:130px' value='{{ k[v]|replace("00:00:00", "")|replace("-", "/") }}' />
    {% endif %}
    {% if v == "current_position" %}
        <input name='present[]' type='hidden' class='form-control' value='{{ k[v] }}' />
    {% endif %}
    {% if v == "to_" %}
        <input name='to[]' type='hidden' style='width:130px' class='form-control' value='{{ k[v]|replace("00:00:00", "")|replace("-", "/") }}' />
    {% endif %}
    {% if v == "industries" %}
        <input type="hidden" value="{{ k[v]|join(",") }}" class="form-control" name="industries[]">
    {% endif %}
    {% if v == "from_" %}
        <ul class='control-group list-inline'>
        <li>
        {{ k[v]|replace("00:00:00", "")|replace("-", "/") }}
                                        &nbsp;&ndash;
        </li>
        {% if v == "current_position" %}
        <li>
            {{ k[v]==True and "Present" or "" }}

        </li>
        {% elif v == "to_" %}
        <li>
            {{ k[v]|replace("00:00:00", "")|replace("-", "/") }}

        </li>
        {% endif  %}

        </ul>
    {% endif  %}

    {% if v == "industries" %}
    <ul class="nav nav-pills">
        {% for industry in k[v] %}
        <li style="display: inline-block">
             <a>{{ industry }}</a>
        </li>
        {% endfor %}
    </ul>
    {% endif %}
{% endfor %}
<br />
<a href='#' class='delete btn btn-danger btn-xs'>Remove</a>
</div>
{% endfor %}
{% endif %}

我发现是我的if-statement引起了问题。 流浪子弹不再存在。

Answer 1

使用标记验证器 （在生成的HTML而不是模板上）。

您不能将div元素作为ul的子级或li的父级。 由于错误恢复，很可能导致生成额外的列表项。

您还似乎将ul和li元素作为同级，这在HTML中也是不可能的。

Answer 2

ul不平衡 /ul之后有一个li吗？

</ul>{% elif v == "to_" %}
<li> 
    <input name='to[]' type='hidden' style='width:130px' class='form-control' value='{{ k[v]|replace("00:00:00", "")|replace("-", "/") }}' />{{ k[v]|replace("00:00:00", "")|replace("-", "/") }}</li>
</ul>{% endif %} {% if v == "industries" %}

另外， div在ul里面吗？