Question

在Ajax调用之后尝试将列表项追加到for循环时，我遇到了一个小问题。列表项get附加到列表顶部，但我希望它附加在列表的底部。谢谢你的帮助。

这是一个片段：

HTML：

{% for this in that %}
<ul class="list-stream" id="reply_sent">
{% if this == cool %}
<li class="cool">
......html code...
</li>
{% else %}
<li class="not-cool">
......html code...
</li>
{% endif %}
</ul>
{% endfor %}

JAVASCRIPT：

$(document).ready(function(){
...jquery / ajax code.....
success: function (response) {
$("#reply_sent").append(response);
},

响应中返回的html是：

<li class="cool">
 ....html code ....
</li>

我希望将其添加到列表的底部，但它会添加到顶部。

Answer 1

假设问题在于列表项的对齐方式，请尝试使用此css

#reply_sent li{
    vertical-align: top;
}

Answer 2

我明白了！以下是我为使其发挥作用所做的更改。

对于HTML：

<ul class="list-stream" id="{{ some unique value you get from each    outer for loop }}">

{％for this in the％}

.....代码....

{％endfor％}

对于JavaScript：

success: function (response) {
$(".list-stream").append(response);
},

使用jQuery将列表项附加到Jinja中的for循环列表

2 个答案: