如何获得任何锚点链接的唯一数据点击

Question

我有以下代码，我想在#itemsdiv容器中显示每次点击锚点的数量。我在这个容器里有6个链接。但每次我点击一个链接，它都不会增加。它保持在1。我必须做些什么才能使每次单击的数据计数增加？fyi-counter应该递增，即使您单击同一个链接两次也是如此。

     $('#items a').data('counter', 0).on('click',function(e){
     var counter = $(this).data('counter'); 
     $(this).data('counter', counter + 1);
     console.log($(this).data('counter')); // increment value in developer tools.
        if ( $(this).data('counter') > 5) {
        console.log('your voting session has ended');
        e.preventDefault();
        $('#items a').remove();
        }
    });

我的HTML如下所示：

<div id="items">
<a href="...">
<a href="...">
<a href="...">
<a href="...">
<a href="...">
<a href="...">
</div>

Answer 1

您应该在标记的开始和增量值上定义数据计数器，如：

$('a').on('click', function(e) {
  e.preventDefault();
  var counter = $(this).data('counter');
  if(counter<5) {
    counter++;
    $(this).data('counter', counter);
    $(this).html(counter);
  }
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<a data-counter="0" href="#">0</a>