javascript - Django Link 在 for 循环中不起作用

Question

我试图在 html 表中的一段表数据周围放置一个链接。当我在 Chrome 的元素查看器中查看时，得到以下结果。

<a href="/tasks/1/"></a>
<a href="/tasks/2/"></a>
<a href="/tasks/3/"></a>
<a href="/tasks/4/"></a>
<table>
...

有趣的是，当我在 View 页面源代码中查看它时......它正确地包裹在

<input type="hidden" name="id" value="3"/>
<a href="/tasks/3/">
<td class="tableText">Make a web app</td>
</a>

我想不出 chrome 会以两种不同方式呈现它的充分理由。我的 django 模板中可能做错了什么吗？

  8 <h1 id="title">Joe's Basic Task List</h1>
  9 <table id="taskTable">
 10 {% for t in taskList %}
 11     <tr>
 12     {%if t.completed == 1%}
 13         <td><div class="btn active"><i class="fa fa-check"></i></div></t    d>
 14     {%else%}
 15         <td><div class="btn"><i class="fa fa-check"></i></div></td>
 16     {%endif%}
 17         <input type="hidden" name="id" value="{{t.id}}"/>
 18         <a href="{% url 'tasks:detail' t.id%}">
 19             <td class="tableText">{{t.task}}</td>
 20         </a>
 21     </tr> 
 22 {% endfor %}
 23 </table>

Answer 1

每MDN TR 只能包含 TD 或 TH 元素的混合。

更改您的模板以弥补这一点。 (看来您可能有一个拼写错误，意思是 t.completed)

可能:

<h1 id="title">Joe's Basic Task List</h1>
<table id="taskTable">
{% for t in taskList %}
    <tr>
    {%if t.completed == 1%}
        <td><div class="btn active"><i class="fa fa-check"></i></div></t    d>
    {%else%}
        <td><div class="btn"><i class="fa fa-check"></i></div></td>
    {%endif%}
        <td class="tableText">
            <a href="{% url 'tasks:detail' t.id%}">{{t.task}}</a>
            <input type="hidden" name="id" value="{{t.id}}"/>
        </td>
    </tr> 
{% endfor %}
</table>

还可以考虑将 div 更改为 span 或将样式直接放在 td 上。两者都显示为 block 元素(td 是表格单元格显示，但其行为与具有样式的 block 级元素类似)。

将 div 嵌套在 td 中似乎是错误的，因为您实际上并不需要它来进行定位/样式设置。