更改哪个元素增加JavaScript

Change Which Element Increment JavaScript

本文关键字：增加 JavaScript 元素      更新时间：2023-09-26

用JavaScript创建一个排行榜，可以立即更新到MongoDB。为了增加某人在排行榜上的得分，你点击相应的<div>，他们的得分就会增加5分。

这是通过使用这个功能来完成的

Template.leaderboard.events({
'click div.inc': function () {
  Players.update(Session.get("selected_player"), {$inc: {score: 5}});
}
});

我希望用户只更新一个播放器，但允许更改。例如，如果用户选择"John Smith"，则"John Smith"应该只能增加5点。除此之外，如果用户决定将分数给予"Janie Smith"，"John Smith"将失去5分，"Janie史密斯"将获得分数。

最好的方法是什么？我可以通过计算前面的"selected_div"来完成这项操作吗？

将Template.leaderboard.events替换为：

Template.player.events({
  click: function() {
    // only continue if this was not the last player clicked
    if (!this.isLast) {
      // find the last player clicked
      var lastPlayerClicked = Players.findOne({isLast: true});
      // remove the isLast marker from the previously clicked player and
      // decrement her score
      if (lastPlayerClicked) {
        var modifier = {$inc: {score: -5}, $unset: {isLast: ''}}
        Players.update(lastPlayerClicked._id, modifier);
      }
      // update this player with a new score and mark her as last
      Players.update(this._id, {$inc: {score: 5}, $set: {isLast: true}});
    }
  }
});

它通过设置或删除isLast来跟踪最后点击的播放器，然后根据需要修改当前和最后一个播放器。在添加之前，您可能希望通过运行meteor reset来确保您有一个干净的数据库。

我认为您需要将最新的玩家添加到数据库中：

Template.leaderboard.events({
    'click input.div': function () {
      var player = Session.get("selected_player");
      var currentPlayer = Players.find(player);
      var recentlyChanged = Players.find({changed: true});
      if(recentlyChanged === currentPlayer) {
          Players.update(player,  {$inc: {score: 5}});
      } else {
          Meteor.call('newScore', recentlyChanged, player);
      }
    }
  });
if (Meteor.isServer) {
 Meteor.methods({
        newScore: function(recentlyChanged, player) {
            if(recentlyChanged) {
                Players.update(recentlyChanged, {$inc: {score: -5}});
            }
            Players.update({}, {changed: false}, {multi: true});
            Players.update(player, {changed: true}, {$inc: {score: 5}});
        }
    });
}
相关文章：