加 1 减 1 onclick

Question

我正在尝试创建一个表单。

objective是有：

共28位玩家（ID=totalplayer）
分 4 组，每组 7 名玩家。（组 = 4 和位置 =7）
发送表格。
点击右箭头时，ID和位置+1。
当位置 = 7 时，将 +1 添加到组中。

我的问题是当我到达位置 7 时，组没有添加 +1。

谢谢，

 /*
 function changeImageUp() will
 
 Add +1 to ID IdNum until hit 28 come back to 1.
 Add +1 to ID Postcounter hit 7 come back to 1.
 Add +1 to ID Groupcounter each time ID Postcounter hit 7.
 When ID Groupcounter hit 4 come back to 1.
 */
 function changeImageUp()
 { 

   positionID = document.getElementById("IdNum").getAttribute("name");
   
   
   if(positionID == 28)
   {
    positionID = 0;
   }
   

   var newPosition = parseInt(positionID) + 1;
   

   document.getElementById("IdNum").setAttribute("name", newPosition);
   

   document.getElementById("IdNum").innerHTML = "<input type= 'checkbox' name='ID' value='" + newPosition + "'checked> " + newPosition;
   
   

   positionSpot = document.getElementById("Poscounter").getAttribute("name");
   

   if(positionSpot == 7)
   {
    positionSpot = 0;
   }
   

   var newPositionSpot = parseInt(positionSpot) + 1;
   

   document.getElementById("Poscounter").setAttribute("name", newPositionSpot);
   

   document.getElementById("Poscounter").innerHTML = "<input type= 'checkbox' name='Position' value='" + newPositionSpot + "'checked> " + newPositionSpot;
   
   

   GroupSpot = document.getElementById("Groupcounter").getAttribute("name");
   if(GroupSpot == 4)
   {
    GroupSpot = 0;
   }
   
   
   if(positionID < 7)
   {
    GroupSpot = 1;
    document.getElementById("Groupcounter").innerHTML = "<input type= 'checkbox' name='Position' value='" + GroupSpot + "'checked> " + GroupSpot;
   }
   else if(positionID > 6)
   {
    GroupSpot = 2;
    document.getElementById("Groupcounter").innerHTML = "<input type= 'checkbox' name='Position' value='" + GroupSpot + "'checked> " + GroupSpot;
   }
   else
   {
    GroupSpot = 3;
    document.getElementById("Groupcounter").innerHTML = "<input type= 'checkbox' name='Position' value='" + GroupSpot + "'checked> " + GroupSpot;
   }

   
 }
 
 


  function changeImageDown()
 { 
   positionID = document.getElementById("IdNum").getAttribute("name");
   if(positionID <= 1)
   {
    positionID = 29;
   }
   var newPositionID = parseInt(positionID) - 1;
   
   document.getElementById("IdNum").setAttribute("name", newPositionID);
   document.getElementById("IdNum").innerHTML = newPositionID;
   
   positionSpot = document.getElementById("Poscounter").getAttribute("name");
  
   if(positionSpot <= 1)
   {
    positionSpot = 8;
    if(GroupSpot == 1)
    {
    GroupSpot = 5;
    }
    var newGroupSpot = parseInt(GroupSpot) - 1;
    document.getElementById("Groupcounter").setAttribute("name", newGroupSpot);
    document.getElementById("Groupcounter").innerHTML = newGroupSpot;
   }
   var newPositionSpot = parseInt(positionSpot) - 1;
   document.getElementById("Poscounter").setAttribute("name", newPositionSpot);
   document.getElementById("Poscounter").innerHTML = newPositionSpot;
   
   
   GroupSpot = document.getElementById("Groupcounter").getAttribute("name");
 }

<!-- 
 Images of arrows pointing Right and left 
 arrow right: Onclick function changeImageUp() +1 to each DIV ID 
 arrow left: Onclick function changeImageDown()  -1 to each DIV ID 
-->
<div id="right" value="right" onclick="changeImageUp();"><image src="images/GroupArrow/right.png" /></div>
<div id="left" value="left" onclick="changeImageDown();"><image src="images/GroupArrow/left.png" /></div>

<!--
 Group name is set to 0 
 Position name is set to 0 
 ID name is set to 0 
-->
Group:<div id="Groupcounter" name="0"></div>
Position:<div id="Poscounter" name ="0"></div>
ID: <div id="IdNum" name="0"></div>

Answer 1

如果你想滚动数字（如果达到极限则设置为零）你应该使用模运算 % 而不是（实际上只是 JavaScript 中除法的余数），所以

positionID = positionID % 28;

,

positionSpot = positionSpot % 7;

和

GroupSpot = GroupSpot % 4;

根据你的table

ID: 1-7 Group = 1
ID: 8-14 Group = 2
ID: 15-21 Group = 3
ID: 21-28 Group = 4

从您的代码开始从零开始

ID: 0-6 Group = 0
ID: 7-13 Group = 1
ID: 14-19 Group = 2
ID: 20-27 Group = 3

Group的数是ID除以7的结果，所以Group的值可以直接由ID的值计算出来通过 GroupSpot = Math.floor(positionID / 7)（如果基于零）。

顺便说一句：只要符号保持不变，加一或减一应该没有什么区别，所以您应该能够在一个函数中完成所有操作。

编辑： 添加了一些示例代码

function changeImage(down) {

  positionID = parseInt(document.getElementById("IdNum").getAttribute("name"));
      if(down){
        positionID--;
      } else {
        positionID++;
      }
      if(positionID < 0){
        positionID = positionID + 28;
      }
      positionID = positionID % 28;   

  document.getElementById("IdNum").setAttribute("name", positionID);
  document.getElementById("IdNum").innerHTML =
    "<input type= 'checkbox' name='ID' value='" + positionID + "'checked> " +
    positionID;

  positionSpot = parseInt(document.getElementById("Poscounter").getAttribute("name"));
      if(down){
        positionSpot--;
      } else {
        positionSpot++;
      }
      if(positionSpot < 0){
         positionSpot =  positionSpot + 28;
      }
  positionSpot = positionSpot % 7;

  document.getElementById("Poscounter").setAttribute("name", positionSpot);
  document.getElementById("Poscounter").innerHTML =
    "<input type= 'checkbox' name='Position' value='" + positionSpot +
    "'checked> " + positionSpot;

  GroupSpot = parseInt(document.getElementById("Groupcounter").getAttribute("name"));
      // not necessary, because we do it directly
  // GroupSpot = GroupSpot % 4;

      GroupSpot = Math.floor(positionID / 7);

      document.getElementById("Groupcounter").innerHTML =
    "<input type= 'checkbox' name='Position' value='" +  GroupSpot +
    "'checked> " +  GroupSpot;
}

如果它向左滚动到全零，我不知道你想做什么，所以根据你的需要进行调整。

加 1 减 1 onclick

Add 1 Substract 1 onclick

javascript

add