Question

我想做一个简单的 JavaScript 程序，让你喜欢和不喜欢。所以实际上我是 JavaScript 新手，这对我来说有点困难。因此，当您单击“关注”按钮时，它会将“countF”变量的数量增加 1，并将按钮文本更改为“取消关注”。所以正如我所说，这是一个基本程序。所以我不知道如何才能反过来做。我的意思是当取消关注按钮点击“countF”应该减少 1，按钮文本应该变回“关注”。是的，我也知道这很简单，但不知何故我做不到。任何帮助或想法如何完成？

var countF = 0;
var btnText = "Unfollow";
var countButton = document.getElementById("followButton");
var displayCount = document.getElementById("followers");
countButton.onclick = function() {
countF++;
followers.innerHTML = countF;
var countButton = document.getElementById("followButton");
countButton.innerHTML = btnText;
if(countButton.innerHTML = btnText) {
countF--;
countButton.innerHTML = "Follow";
}
}

<div id="followers">0</div>
<button id="followButton"></button>

Answer 1

观看此视频，了解有关投票系统的精彩教程。 https://www.youtube.com/watch?v=mBPURBO1kD8 每当您进行投票时，您不仅需要通过客户端来处理投票。

话虽如此，也许这个概念会有所帮助：

let likedPost = false

function toggleVote() {
    likedPost ? removeUpvote() : addUpvote()
    likedPost = !likedPost
}

function removeUpvote() {
    //code for removing
    //probably should be a few calls to a server
}
function addUpvote() {
    //code for adding
    //probably should be a few calls to a server
}

Answer 2

这样的事情会起作用：

var countF = 0;
var countButton = document.getElementById("followButton");
var displayCount = document.getElementById("followers");
countButton.onclick = function() {
if (countButton.innerText == "Follow") {
    countF++;
    countButton.innerText = "Unfollow";
  } else if (countButton.innerText == "Unfollow") {
    countF--;
    countButton.innerText = "Follow";
  }
  followers.innerHTML = countF;
}

并向按钮添加文本：

<button id="followButton">Follow</button>

JavaScript 关注/取消关注按钮

2 个答案: