JQuery attr всегда возвращает то же значение

Question

Ребята у меня есть список сообщений, где каждое сообщение имеет собственный идентификатор. Я хочу, чтобы jquery получил этот идентификатор от настраиваемого атрибута. Проблема в том, что когда я пытаюсь отлаживать, я получаю все время за какое-то значение.

Это таблица html, которую я перечислил из базы данных с PHP. У каждого сообщения есть определенный идентификатор.

Name  | id 
------------------- 
Post 1 | 188 
Post 2 | 189 
Post 3 | 190 

<i id="like" class="glyphicon glyphicon-heart" data-id="<?=$post->post_id;?>"></i> Like 

Так что, когда я пытаюсь получить значение из данных идентификатора сценария всего времени возвращение номер. Когда нажимают на сообщение 1, сообщение 2, сообщение 3 все время составляет 188 !!! Что?

Вот JQuery:

isPostLiked: function() { 
    var isLiked = false; 
    var likeText = $("#like"); 
    var itemId = likeText.attr("data-id"); 

    // debug 
    Post.postLikeBtn.click(function() { 
     console.log(itemId); 
    }); 

    //$.ajax({ 
    // type: "post", 
    // url: baseurl + "/like/isLikedAjaxAction/" 
    //}); 

    if (isLiked == true) { 
     likeText.css("color", "red"); 
    } 
}, 

Answer 1

кажется вы создаете HTML в цикле. Помните, что идентификаторы в HTML должны быть уникальными, вы можете использовать класс CSS, тогда можно использовать Class Selector (“.class”). Изменить HTML вам, как

<i class="like glyphicon glyphicon-heart" data-id="<?=$post->post_id;?>"></i> Like 

Изменения обработчики кликов и получать идентификаторы с использованием текущего контекста элемента, т.е. this

$('.like').click(function(){ 
    var id= $(this).data('id'); 
}); 

Answer 2

Каждый элемент должен иметь уникальный идентификатор атрибута. У вас не может быть более одного элемента с идентификатором «like». Попробуйте что-нибудь подобное вместо этого:

<i class="like glyphicon glyphicon-heart" data-id="<?=$post->post_id;?>"></i> Like 

Затем определяют это сделать, чтобы установить функцию обратного вызова:

$('.like').click(function() { /* your code here */ });