jQuery | Данные атрибута обновить вопрос

Question

У меня есть следующий код JQuery:

Это HTML:

<div 
    class="continueReading" 
    data-skip="0" 
    data-categories="22,243" 
    data-is="single" 
    data-s="cd1f2f7a7d" 
    data-list="latestNews-sidebar-1" 
> 
    <a href="javascript:void();" class="latestNewsWidgetMoreLink">get more</a> 
    <a href="javascript:void();" class="latestNewsWidgetMoreButton">»</a> 
</div> 

и JQuery это:

$('.latestNewsWidgetMoreLink, .latestNewsWidgetMoreButton').click(
    function() 
    {  
     total_items = 10; 
     $(this).parent('div').attr('data-skip', total_items); 
    } 
); 

но, кажется, не работают. Может кто-нибудь мне помочь? Есть ли ошибка в этом коде?

Примечание: Я также попробовать следующий код не повезло:

total_items = 10; 
$(this).parent('div').data('skip', total_items); 

Answer 1

Код действует для меня в this example jsFiddle. Я подозреваю, что код выполняется слишком рано, и в результате обработчики событий click не привязаны к элементам (потому что они еще не существуют). Попробуйте окружив его $(document).ready() вызова:

$(document).ready(function() { 
    $('.latestNewsWidgetMoreLink, .latestNewsWidgetMoreButton').click(function() { 
     total_items = 10; 
     $(this).parent('div').data('skip', total_items); 
    }); 
}); 

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

Обратите внимание, что я сделал пару корректировок:

1. Удалены с запятой из href атрибутов <a> элементов - вызывало ошибку синтаксиса JavaScript
2. Использование функции .data() JQuery, а чем .attr()

Answer 2

Удалить javascript:void(); как из ссылки, а затем инспектировать HTML DIV с поджигатель и нажмите на ссылку, он будет установлен data-skip="10";

Answer 3

Код работает нормально. См. this. Вторая ссылка не будет работать, потому что вы забыли точку в селекторе jQuery. Таким образом, вы должны изменить

$('.latestNewsWidgetMoreLink, latestNewsWidgetMoreButton') 

в

$('.latestNewsWidgetMoreLink, .latestNewsWidgetMoreButton')