我在Django 2.1上使用了wagtail 2.3,对于特定的循环,包含<a>
标记的RTF元素被渲染为错误。
这是使用的模板:
<div id="interactions-table">
{% for interaction in value.interactions %}
<a href="javascript:;" class="interactions-table__elem combo-not-active" style="background-color: {{ interaction.interaction_type.colour }}">
<p class="interaction-table__elem__interaction__name">{{ interaction.drug_name }}</p>
<div class="d-none interaction-table__elem__interaction">
<h4>{{ interaction.interaction_type }}</h4>
{{ interaction.description | richtext }}
</div>
</a>
{% endfor %}
</div>
下面的代码片段显示了3个要渲染的元素。前两个正确显示在其<a>
内部,但是第三个不是:
<div id="interactions-table">
<a href="javascript:;" class="interactions-table__elem combo-not-active" style="background-color: #9BEA8B">
<p class="interaction-table__elem__interaction__name">Paracetamol</p>
<div class="d-none interaction-table__elem__interaction">
<h4>Low risk and no synergy</h4>
<div class="rich-text"><p>...</p></div>
</div>
</a>
<a href="javascript:;" class="interactions-table__elem combo-not-active" style="background-color: #9BEA8B">
<p class="interaction-table__elem__interaction__name">Ibuprofen</p>
<div class="d-none interaction-table__elem__interaction">
<h4>Low risk and no synergy</h4>
<div class="rich-text"><p>content.... </p></div>
</div>
</a>
<a href="javascript:;" class="interactions-table__elem combo-not-active" style="background-color: #F37A70">
<p class="interaction-table__elem__interaction__name">Tricyclics</p>
</a>
<div class="d-none interaction-table__elem__interaction">
<a href="javascript:;" class="interactions-table__elem combo-not-active" style="background-color: #F37A70">
<h4>Dangerous</h4>
</a>
<div class="rich-text">
<a href="javascript:;" class="interactions-table__elem combo-not-active" style="background-color: #F37A70"></a>
<p>
<a href="javascript:;" class="interactions-table__elem combo-not-active" style="background-color: #F37A70">
beginning of content...
</a>
<a href="/somewhere">
link in original content
</a>
end of content
</p>
</div>
</div>
</div>
谢谢。
答案 0 :(得分:3)
这实际上不是Wa问题。 Wagtail只是在做您的模板告诉它的操作,然后将一个链接放在另一个无效的HTML链接内。然后,您的浏览器尝试通过在打开新链接之前关闭链接来恢复该链接,这是您在开发人员工具栏中所看到的。如果改用浏览器的“查看源代码”选项,则会看到(无效的)嵌套链接。
您需要找到一种不需要嵌套链接的实现Javascript交互的不同方法,或者通过features
/ {{ 1}}。