Question

我做了一个upvote / downvote按钮here 。现在我希望它取消投票，如果有人点击upvote / downvote按钮2次。示例：第一次单击=投票+ 1 / -1，第二次单击=投票-1 / + 1（取决于，如果他点击upvote或downvote）

HTML：

exec deptree_fill('TABLE',user,'YOUR_TABLE');
  select * from  deptree;
  select * from ideptree;

的Javascript

<center><button class="buttonup" id="plus" style="vertical-align:middle" > <span>Upvote </span> </button>         <span id="count">0</span>
        <button  class="buttondw" id="minus" style="vertical-align:middle"><span>Downvote </span> </button></center>


<script src="//code.jquery.com/jquery-1.11.0.min.js"></script>

Answer 1

您只能将一个数据保存到localstorage当前的投票数。尝试运行此代码..

var counter = 0, // Try change this what ever you want
  votePlus = counter + 1,
  voteMinus = counter - 1;

function checkIfUserVoted() {
  return localStorage.getItem("voted");
}
if (!localStorage.getItem("voted")) {
  localStorage.setItem("voted", counter);
  $("#count").text(counter);
}
$("#plus").click(function() {
  var vote = checkIfUserVoted() != votePlus ? votePlus : counter;
  localStorage.setItem("voted", vote);
  $("#count").text(vote);
});
$("#minus").on('click', function() {
  var vote = checkIfUserVoted() != voteMinus ? voteMinus : counter;
  localStorage.setItem("voted", vote);
  $("#count").text(vote);
});

请参阅此working fiddle

Answer 2

我添加了downvote函数来检查用户是否已进行了downvoted，并进行了一些其他更改。希望它会有所帮助

$(document).ready(function() {
    function checkIfUserVoted() {
    return true ? localStorage.getItem("voted") === "true" : false
}
function checkIfUserdownVoted() {
    return true ? localStorage.getItem("downvoted") === "true" : false
}

var counter = 0;
if(localStorage.getItem("count") == null)
    $("#count").text(0);
else {
    counter = localStorage.getItem("count");
    $("#count").text(counter);
}


$("#plus").click(function(){

  if (checkIfUserVoted()) {
  localStorage.setItem("downvoted", "false");
  } else {
    localStorage.setItem("voted", "true");
    localStorage.setItem("downvoted", "false");
    counter++;
  $("#count").text(counter);
  localStorage.setItem("count", counter);
  }

});

$("#minus").click(function(){

  if (checkIfUserdownVoted()) {
  localStorage.setItem("voted", "false");
  } else {
    localStorage.setItem("downvoted", "true");
    localStorage.setItem("voted", "false");
    counter--;    
  $("#count").text(counter);
  localStorage.setItem("count", counter);
  }
});
});

Answer 3

这个可以在不事先设置计数器变量的情况下工作

JSFiddle

$(document).ready(function() {
    function checkIfUserUpVoted() {
        return true ? localStorage.getItem("upvoted") === "true" : false
    }

    function checkIfUserDownVoted() {
        return true ? localStorage.getItem("downvoted") === "true" : false
    }

    var counter = 0;
    if (localStorage.getItem("count") == null)
        $("#count").text(0);
    else {
        counter = localStorage.getItem("count");
        $("#count").text(counter);
    }


    $("#plus").click(function() {
        if (checkIfUserUpVoted()) {
            counter = parseInt(counter) - 1;
            localStorage.setItem("upvoted", "false");
        } else if (checkIfUserDownVoted()) {
            counter = parseInt(counter) + 2;
            localStorage.setItem("downvoted", "false");
            localStorage.setItem("upvoted", "true");
        } else if (!checkIfUserVoted()) {
            counter = parseInt(counter) + 1;
            localStorage.setItem("upvoted", "true");
        }
        $("#count").text(parseInt(counter));
        localStorage.setItem("count", counter);
        updateValues();
    });

    $("#minus").click(function() {
        if (checkIfUserUpVoted()) {
            counter = parseInt(counter) - 2;
            localStorage.setItem("upvoted", "false");
            localStorage.setItem("downvoted", "true");
        } else if (checkIfUserDownVoted()) {
            counter = parseInt(counter) + 1;
            localStorage.setItem("downvoted", "false");
        } else if (!checkIfUserVoted()) {
            counter = parseInt(counter) - 1;
            localStorage.setItem("downvoted", "true");
        }
        $("#count").text(parseInt(counter));
        localStorage.setItem("count", counter);
        updateValues();
    });
});

如果有人点击upvote / downvote按钮2次，如何取消投票

3 个答案: