Question

我创建了一个JavaScript函数来增加和减少like按钮中的数字，这是函数

var val = 0; 
var negative = false;
$('.i-t').click(function(){
val = val + ((negative) ? -1 : 1); 
negative = (negative) ? false : true;
$("#myval").text(val);
});

此功能在第一次点击时效果很好但是第二次点击它没有删除该值，该功能有问题吗？这是按钮

 <button id="myvals" class="myvals">
 <i class="myvals" id="i-t"></i> 
 <span class="myvals" id="voteScore">123</span></button>

如果喜欢的话，我想将123更改为124，如果不喜欢则将其更改为122，并且它不起作用，对不起，我必须从一开始就更好地准备问题

Answer 1

根据您的评论和更新，您要做的是根据您是否已点击来增加/减少投票次数。

在这种情况下，如果您需要，可以使用类来存储状态以支持多个投票按钮，而不是使用变量

$('button.vote').click(function () {
    var $btn = $(this).toggleClass('voted');
    $(this).find("span.score").text(function (i, val) {
        return +val + ($btn.hasClass('voted') ? 1 : -1);
    });
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<button class="myvals vote"> <i class="myvals" id="i-t">here</i><span class="myvals score">123</span></button>

Answer 2

试试这个：

var val = 0;
var negative = false;
$('.i-t').click(function() {
    val = parseInt($("#voteScore").val()) + ((negative) ? -1 : 1);
    negative = (negative) ? false : true;
    $("#myval").text(val);
});

Answer 3

你需要两个按钮，一个用于向上，一个用于向下，或者你可以使用一个按钮和一个向上或向下的复选框，但我认为两个按钮更简单。

当从DOM元素中读取值时，它们通常是字符串，因此如果需要数字，特别是对于添加，请不要忘记在执行算术之前将值转换为数字。

所以按钮和代码可以是：

＆＃13;

function vote(n) {
  // Get the element to update
  var el = document.getElementById('votes');

  // Convert the text content to Number, then add value
  el.textContent = Number(el.textContent) + n;
}

＆＃13;

Votes: <span id="votes">123</span>
<button onclick="vote(1)">up vote</button>
<button onclick="vote(-1)">down vote</button>

＆＃13;

当然这只是一个演示，可以根据自己的意愿进行调整。

递增和递减Javascript无法正常工作

3 个答案: