jQuery 'vote'ボタンはすべての要素に影響します

Question

foreachループ（php）を介してページに表示されているdivがあります。それぞれのdivでは、クリックされたときは、私は1つのdiv内の投票ボタンをクリックしたときに1ずつ増加することになっている投票ボタンは、しかし、1すべての票の増加は、ここに私のjqueryのがありますされています

$(document).ready(function($) { 
    $.ajax({ 
     url: "index.php", 
     success: function(data) { 
     $('.fa-plus').each(function(){ 
      $(this).on('click', function(){ 
       var counter = 0; 
       counter = counter+1; 
       $('.votes').html(counter); 

      }) 
     }); 
     }     
    }) 

そして、私の簡略化のために整えた私のマークアップのスニペット：

foreach ($applications as $application){ 
    echo '<div class="widget-main">', 
      '<span class="pull-right votes" id="votes-count"><strong>0</strong> </span>', 
      '<h4 class="list-group-item-heading remove-margin"><i class="fa fa- heart fa-fw"></i>'.$votes.' Votes</h4>',       
      '<h4 class="list-group-item-heading remove-margin"><i class="fa fa-plus fa-fw"></i> Vote for '.$application ->_name.'</h4>',       
     '</div>'; 
    } 

PS私はデータベースに投票を挿入するつもりです。

Answer 1

$('.fa-plus').on('click', function(){ 
 
\t var voteup = $(this); 
 
\t $.ajax({ 
 
\t \t url: "index.php", 
 
\t \t data: {"increasevote":1}, 
 
\t \t success: function(response){ 
 
\t \t \t voteup.closest('.votes').text(response) 
 
\t \t \t } 
 
\t \t }) 
 
})

• あなたのデータでは、複数の票を持っているので、あなたのスクリプトが知っているよう
• あなたのPHPスクリプトは、渡されたデータを取得し、更新するために、どの行識別子を含みます、データベースを更新し、総投票数を返す
• は、クラス "votes"を持つ最も近い親の合計投票を返す

Answer 2

$（ '。votes'）.html（counter）;この線は犯人のようです。クラス投票のすべてのdivにすべてのカウンタを割り当てます。

投票ボタンの親divを見つける必要があります。私はあなたがこれを試すことができますあなたのhtmlでは分かりません。

$(this).closest('.votes').html(counter);