0

标题可能不太清楚。非常遗憾。这是我的问题;

我使用 for 循环在索引页面中呈现我的帖子。并且所有帖子都有向上和向下投票的选项。我想通过 ajax 发送这些投票请求。但是当我编写代码时,ajax 仅适用于页面中的第一个内容。下面,不起作用。我意识到,当我使用 for 循环时,会有多个帖子具有相同的 ID。这就是 ajax 和 html 忽略其他内容的原因。

这是我的代码

索引.html:

<ul>
    {% for post in posts %}
     <li>
      <input type="hidden" value="{{post.id}}" id="post_id" />
      {{ post.title }}
      <a href="javascript:" id="vote_up">VOTE UP</a>
      <a href="javascript:" id="vote_down">VOTE DOWN</a>
      <button id="current_vote"> {{ post.vote }} </button>
    </li>
    {% endfor %}
</ul>

和js方面:

$( function (){                                                                      
 49     var post_id = $('#post_id').val();                                               
 50     $('#vote_up').click( function(){                                                 
 51         var vote = 1;                                                                
 52         var ajaxOpt = {                                                              
 53             type: 'post',                                                            
 54             url: '/content/vote/',                                                   
 55             data: {                                                                  
 56                 'vote': vote,                                                        
 57                 'post_id': post_id,                                                  
 58                 },                                                                   
 59             success: function(data){                                                 
 60                 $('#current_vote').text(data.vote_new);                                
 61                 },                                                                   
 62             error: function(){                                                       
 63                 console.log('error :[');                                             
 64                 }                                                                    
 65         };                                                                           
 66         $.ajax(ajaxOpt);                                                             
 67         return false;                                                                
 68                                                                                      
 69         })
            // same code for vote_down                                                                           
 89 })

我认为我的方式有问题。我该怎么办?

谢谢你。

4

1 回答 1

5

这只是投票的一个例子。您可以从这里开始,然后投票否决:

<ul>
    {% for post in posts %}
    <li>
       {{ post.title }}
       <a href="/content/vote/{{post.id}}/" class="vote_up" data-id="{{post.id}}">VOTE UP</a>
       <button id="current_vote"> {{ post.vote }} </button>
    </li>
    {% endfor %}
</ul>

<script>
$(document).ready(function(){
    $('.vote_up').click(function(){
        var post_id = $(this).attr('data-id');
        var url = $(this).attr('href');
        $.getJSON(url, function(data){});
        return false;
    });
});
</script>
于 2013-01-26T15:56:50.837 回答