使用 jquery 选择 django 对象

Question

我有一个模型的对象显示在一个带有这样的 for 循环的模板中：

{% for post in posts %}

 {{post.text}}

{% endfor %}

现在我想为每个包含 post.id 值的 post 对象附加一个按钮，并且在单击该按钮时应该发出一个更新该特定对象上的投票属性的 ajax 请求。

所以，我尝试添加这样的按钮：

{% for post in posts %}

     {{post.text}}

<input type="submit" value="V" id="upButton" post_id="{{post.id}}"></input>

    {% endfor %}

在使用 ajax 之前，我只想查看按钮是否正常工作，因此我尝试检查（使用 jQuery）是否会提醒每个帖子的 post.id 值：

<script>
    $(document).ready(function(){
       $('#upButton').click(function(){
        var post_id = $('#upButton').attr('post_id');
        alert(post_id);
      });
    });
  </script>

只有第一个对象上的按钮有效。其他按钮不起作用。这里发生了什么？

Answer 1

id 属性每个 html 页面只能设置一次。

因此，javascript 代码将始终只引用第一个元素。

改成：

<input type="submit" value="V" data-role="upButton" post_id="{{post.id}}"></input>

在 javascript 中：

<script>
    $(document).ready(function(){
       $('[data-role=upButton]').click(function(){
        var post_id = $(this).attr('post_id');
        alert(post_id);
      });
    });
  </script>

它应该可以工作