jQueryでのクリックイベントの処理（Like and Unlikeボタン用）

Question

AJAXとjQueryを使用してLike-Unlikeシステムを作成しようとしています。 「好き」のイベントは正常に機能しているようですが、「好き」としたいときは、イベントが応答していません。この問題を解決するための提案は感謝しています。

$(document).ready(function() { 
    $(".like").click(function() { //this part is working 
     var item_id = $(this).attr("id"); 
     var dataString = 'item_id=' + item_id; 
     $('a#' + item_id).removeClass('like'); 
     $('a#' + item_id).html('<img src="images/loader.gif" class="loading" />'); 
     $.ajax({ 
      type: "POST", 
      url: "ajax.php", 
      data: dataString, 
      cache: false, 
      success: function(data) { 
       if (data == 0) { 
        alert('you have liked this quote before'); 
       } else { 
        $('a#' + item_id).addClass('liked'); 
        $('a#' + item_id).html(data); 
       } 
      } 
     }); 

    }); 

    $(".liked").click(function() { //this part is not working 
     var item_id = $(this).attr("id"); 
     console.log(item_id); 
     var dataString = 'item_id=' + item_id; 
     $('a#' + item_id).removeClass('liked'); 

     $('a#' + item_id).html('<img src="images/loader.gif" class="loading" />'); 
     $.ajax({ 
      type: "POST", 
      url: "ajax.php", 
      data: dataString, 
      cache: false, 
      success: function(data) { 
       if (data == 0) { 
        alert('you have liked this quote before'); 
       } else { 
        $('a#' + item_id).addClass('like'); 
        $('a#' + item_id).html(data); 
       } 
      } 
     }); 

    }); 
}); 

Answer 1

$(".like")と$(".liked")文書の準備ができたときに取得されますが、あなたが/要素からクラスを削除する追加したときに更新されません。

あなたはより一般的なクラスに「のようなトグル」のような投票の要素を割り当てる場合は、次の操作を行うことができるだろう：

$(document).ready(function() { 
 
    $('.like-toggle').click(function(event) { 
 
    if ($(event.target).hasClass('like') { 
 
     // Call your unlike code, replace like with liked. 
 
    } else { 
 
     // Call your like code, replace liked with like. 
 
    } 
 
    }); 
 
});

これは動作しますlike-toggleクラス理由は決して要素から削除されるので、ドキュメントが準備ができているときに存在する要素は機能し続けるでしょう。