Question

我正在制作我的好友和我玩的骰子游戏的JavaScript / jQuery版本。这是游戏的3人版本：

我正在尝试创建一个游戏版本，用户可以选择玩多少玩家，并以相同的方式运行游戏功能：

每次按下“Go”按钮时，它应该转到下一个人的转弯，如果for循环中的条件检查轮到它，我使用模块化操作符，这样我就可以执行特定操作轮到他们了。

opt

这对我创建的每个玩家都很有用，除了最后一个玩家（玩家#plaminCount）。这是因为playerCount％playerCount = 0，而且我从不为0，所以总是跳过最后一个玩家。

我尝试使用else语句解决这个问题，当时转％％playerCount = 0：

var turn = 0;

$(".goButton").click(function() {
  turn = turn + 1;
  var playerCount = $('#input-number').val();  

  for (i=1;i <= playerCount;i++){
    if (turn % playerCount == i) {
    $(".player" + i + "dollars").append("Hi!");
    }
  }
});

然而，当我到达＃playerCount的玩家时，我获得了playerCount次“hi！”追加。例如，对于5个玩家，这是浏览器中的输出：

var turn = 0;

$(".goButton").click(function() {
  turn = turn + 1;
  var playerCount = $('#input-number').val();  

  for (i=1;i <= playerCount;i++){
    if (turn % playerCount == i) {
    $(".player" + i + "dollars").append("Hi!");
    } else if (turn % playerCount == 0) {
    $(".player" + playerCount + "dollars").append("Hi!");
    }
  }
});

这是我经典的“off by 1”错误吗？或者我的其他声明在某种程度上存在缺陷？

Answer 1

取出循环外的第4个玩家状态。问题是当turn ==playercount时，你不必进入循环，因为该condiiotn独立于i并且将始终为真，因此hgetting执行时间。

for (var i=1;i <= playerCount;i++){
if (turn % playerCount == i) {

  $(".player" + i + "dollars").append("Hi!");
}
}
    if (turn % playerCount == 0) {
   $(".player" + playerCount + "dollars").append("Hi!");
 }

这是代码工作代码片段：

＆＃13;

var turn = 0;
var pot = 0;

  $("form").submit(function(event){
    var i = 0
    var playerCount = $('#input-number').val();
    var dollarCounts = [];
    $(".players").empty();
    for (var i=1; i <= playerCount; i++) {
      var player= "player";
      player = player + i.toString();
      $(".players").append(
        '<div class="player-wrap"><div class="player' + i.toString() + ' clearable">Player '
        + i + 
        '</div>$<span class="' + player + 'dollars clearable"></span><br><br><br></div>');
      dollarCounts[i] = 3;
      $("." + player + "dollars").empty().append(dollarCounts[i]);
    }
    event.preventDefault();
  });


//TURN
$(".goButton").click(function() {
  
  turn = turn + 1;
  var dice1 = Math.floor(Math.random() * 6) + 1;
  var dice2 = Math.floor(Math.random() * 6) + 1;
  var dice3 = Math.floor(Math.random() * 6) + 1;
  $(".turn").empty().append(turn);

  
  //Print "Left", "Right", "Center"
  if (dice1 == 1) {
    $(".d1").empty().append("LEFT");
  }
  if (dice2 == 1) {
    $(".d2").empty().append("LEFT");
  }
  if (dice3 == 1) {
    $(".d3").empty().append("LEFT");
  }
  if (dice1 == 2) {
    $(".d1").empty().append("RIGHT");
  }
  if (dice2 == 2) {
    $(".d2").empty().append("RIGHT");
  }
  if (dice3 == 2) {
    $(".d3").empty().append("RIGHT");
  }
  if (dice1 == 3) {
    $(".d1").empty().append("CENTER");
  }
  if (dice2 == 3) {
    $(".d2").empty().append("CENTER");
  }
  if (dice3 == 3) {
    $(".d3").empty().append("CENTER");
  }
  if (dice1 == 4 || dice1 == 5 || dice1 == 6) {
    $(".d1").empty().append("SAFE");
  }
  if (dice2 == 4 || dice2 == 5 || dice2 == 6) {
    $(".d2").empty().append("SAFE");
  }
  if (dice3 == 4 || dice3 == 5 || dice3 == 6) {
    $(".d3").empty().append("SAFE");
  }
  var playerCount = $('#input-number').val();  
  
  for (var i=1;i < playerCount;i++){
  
    if (turn % playerCount == i) {
    
      $(".player" + i + "dollars").append("Hi!");
    }
  }
  if (turn % i == 0) {
      $(".player" + playerCount + "dollars").append("Hi!");
    }  
});

//RESET
$(".resetButton").click(function() {
  turn = 0;
  pot = 0;
  $(".players").empty();
  var playerCount = 0;
  var dollarCounts = [];
  $(".turn").empty().append(turn);
  $(".pot").empty().append(pot);
  $(".d1").empty();
  $(".d2").empty();
  $(".d3").empty();
});

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<form id="start-form">
        <label for="input-number">Number of players:</label>
        <input id="input-number" type="number">
        <button type="submit" class="btn">Set Player Count</button>
      </form>

<button class="goButton" type="submit">Go</button>
<button class="resetButton" type="submit">Reset</button>
<br><br>
<div class="players"></div>
<h1>Turn count: <span class="turn"></span></h1>
<h2>Rolls: 
  <span class="d1"></span> 
  <span class="d2"></span> 
  <span class="d3"></span>
</h2>
<br>
<br>
<br>
<br>
<br>
<h1>POT</h1>
<div class="pot"></div>

＆＃13;

Answer 2

当您遍历playerCount并尝试获取要追加的类名时，问题就在于您的循环。

尝试执行以下操作，而不是整个循环：

var m = turn % playerCount;
if (m==0) {m = playerCount};
$(".player" + m + "dollars").append("Hi!");

for循环中的最后一项在Javascript中执行多次

2 个答案: