Question

以下是代码。

<body>
<div class="test" >Test</div>

<script>
var count =1;
$('body').on('click', '.test', function () {

    $('.test').attr('data-count',count);
    count ++;
})

我想为这样的数据计数添加多个值，data-count =＆＃34; 1,2,3,4＆＃34;。我怎样才能做到这一点？

Answer 1

没有全局变量的解决方案：

$('body').on('click', '.test', function () {

    var $this = $(this),
        count = $this.data('i') || 1,
        $test = $('.test');

    count++;
    $this.data('i', count);

    var result = [];

    for(var i = 1; i < count; i++){
        result.push(i);
    }

    $test.attr('data-count', result.toString());
});

http://jsfiddle.net/r7ny77s9/

Answer 2

var count = 1;
var countArr = [];
$('body').on('click', '.test', function () {
    countArr.push(count);
    $('.test').attr('data-count', countArr.join(","));
    count ++;
});

编辑：不使用第二个变量

var count = 1;

$('body').on('click', '.test', function () {    
  var testVal = $('.test').attr('data-count') === undefined ? count : $('.test').attr('data-count') + "," + count;
  $('.test').attr('data-count', testVal);
    count ++;
});

Answer 3

与Alok Swain的答案类似，将data-* count保存为元素

var count = 1;
var arr = [];
$(".test").data("count", arr);
$('body').on('click', '.test', function () {
    $('.test').data("count", arr.push(count));
    count++;
});

使用jQuery向数据属性添加多个值

3 个答案: