[jQuery] 変化するid属性に対して、jQueryで処理するには？

Question

#問題点
select * from posts でテーブルにある全ての投稿を取り出すのですが、それぞれに個別のidが付与されるようにしています。
そして、そのid属性を持ったボタンがクリックされると、それぞれのいいね数を変化させることを目標にしています。
そのような場合、どのようにすればjQueryで変化するid属性を処理できますか？

分かりにくいと思いますが、よろしくお願いします。

 <section class="images">
       <ul class="img_row">
         <?php
           $sql = "SELECT * FROM posts ORDER BY id desc;";
           $stmt = $pdo->prepare($sql);
           $stmt -> execute();
           while ($row = $stmt -> fetch(\PDO::FETCH_ASSOC)):
          ?>
         <li>
           <?php
           echo ("<a href='/images/$row[file_name]'>");
           echo ("<img src='/thumbs/$row[file_name]' class='img' id ='$row[id]'></a>");
           echo ("<div class='heart icon' id='icon_$row[id]'></div>");
           echo ("<div class='likes_count' id='likes_count_$row[id]'>  $row[likes_count] </div>");
           ?>        
         </li>
         <?php endwhile; ?>
       </ul>
     </section>

     <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script>
       <script>
       $(function() {
         'use strict';

         $('#icon').on('click', function() {
           $(this).css('color', 'red');
           $.post('Countup.php', {
             id: $('img').attr('id'),
           }, function(data) {
             $('#likes_count').text(data);
           });
         });
       });
       </script>

Comments

[kei344]

「#icon」がありませんが、どの要素をクリックさせたいのでしょうか。

Answer 1

kei344さんの回答がほぼ全てでしょうけど考え方だけ。

• わざわざimgにidを振ったあと別途divに変形してidを振っていますが、

最初からdivにidを振ればよいでしょう。

• またdiv.iconは空要素のようなので、クリックさせるのは微妙
• それといいねは1ユーザー1回でしょうから、セッションでuidを渡して

すでに押したかどうかを予めわかるような処理が必要です

• いいねの取り消し処理についても検討する必要があるかもしれません。
• 受けるCountup.php側も単にカウントをアップするのではなく、

誰からイイねがおされたかをためていくテーブルが必要です

Answer 2

エスパー回答。

$( '.icon' ).on( 'click', function() {
	var $_t = $( this );
	$_t.css( 'color', 'red' );
	$.post( 'Countup.php', {
		id: $_t.parent().find( 'img' ).attr( 'id' )
	}, function( data ) {
		$_t.parent().find( '.likes_count' ).text( data );
	} );
} );

Comments

[mango]

ありがとうございました！