Django / Jquery PreventDefault仅适用于for循环的第一项

Question

我正在尝试使用Jquery PreventDefault在我的django博客文章中使用一些AJAX循环，但PreventDefault仅适用于顶级帖子

模板

{% for posts in list %}
   #{{ posts.title }} and other stuff goes here
    <a href=""  data-href="  " id="like-btn"></a>
    <span data-likes=" {{ posts.like.count }} " id="{{posts.id}}" > {{ posts.like.count }} </span>
{% endfor %}

jquery的

$(document).ready(function(){
    $("#like-btn").click(function(e){
            e.preventDefault();
    })

preventDefault在第一篇帖子中运行正常，但它不适用于任何其他帖子。

Answer 1

这是一个javascript / html问题，与django无关。 DOM元素的id属性应该是唯一的。因此，You4＃like-btn唯一标识一个类似按钮。在你的情况下，这是第一个像按钮。您的HTML应更改为

{% for posts in list %}
   #{{ posts.title }} and other stuff goes here
    <a href=""  data-href="  " class="like-btn"></a>
    <span data-likes=" {{ posts.like.count }} " id="{{posts.id}}" > {{ posts.like.count }} </span>
{% endfor %}

然后你的js到

$(document).ready(function(){
    $(".like-btn").click(function(e){
           e.preventDefault()
})