Question

我有一个按钮，每次点击它我都希望它为数据属性添加5。由于某种原因，我在解决这个问题时遇到了一些麻烦。我尝试了几种不同的东西，但似乎没有什么对我有用。

var i = 5;
$(this).attr('data-count', ++i);

但是这只会因为某些原因而触发一次，如果我点击它会将数据属性设置为6但是如果我再次点击它会保持在6。

然后我尝试了普通的javascript add运算符，但因为它没有正常运行。

var x = 5;
var y = count;
var newcount = x + y;
$(this).attr('data-count', newcount);

此输出为50，然后再次单击它为550，依此类推。

我确信我错过了一些东西，但我不确定我做错了什么。

我真的很喜欢第一个工作，因为我想要计算，因为我正在添加到现有列表，因为我的完整代码在下面。

$( document ).on( "click", "#showButton", function() {
    var q = $(this).attr('data-q');
    var type = $(this).attr('data-type');
    var count = $(this).attr('data-count');
    $(this).text('More');
    var i = 5;
    $(this).attr('data-count', ++i);
    $.ajax({ 
       dataType: 'html',
       data: '',
       type: 'POST',
       url : '',
       success: function(response) {
          $('#responseContainer').append(response);
       }
    });
});

Answer 1

“问题”
init：$this.data('count', 0)
onclick：$this=$(this);$this.data('count', $this.data('count')+5)
“问题”
newcount = x++y

当您使用attr代替data时，原因是y是字符串...

提示：您可以将对象用作数据，例如：
$(this).data('prop', {count:0});$(this).data('prop').count+=5;

Answer 2

很少有事情需要记住，

a。 jquery标识以data开头的属性，因此为了提取它，您只需使用.data('attr')代替.attr('data-attr') 。
b。要增加值，您需要将其附加到现有值，因此您需要：$(this).data('count', $(this).data('count') + (++i));。

$( document ).on( "click", "#showButton", function() {
    var count = $(this).data('count');
    $(this).text('More');
    var i = 5;
    $(this).data('count', $(this).data('count') + (++i));
    alert($(this).data('count'));
    });

示例：https://jsfiddle.net/DinoMyte/1e0fvkng/

无法正确添加javascript添加运算符

2 个答案: