Javascript 让我的JS函数显示在正确的位置

我和JS相处得很艰难，需要一些帮助。这是我第一次使用JS，我正在为一个课程项目构建一个记忆游戏。我制作了一个模式，当你完成拼图时弹出。此时，模式会在开始时弹出，因为在玩家将谜题置乱之前，谜题已经完成。我需要它出现一旦拼图已经被扰乱，然后再放回一起。目前我的信心很低，所以任何建议都将不胜感激。如果有人能帮忙，我已经把我的代码放在下面了

function swapTiles(cell1, cell2) {
  var temp = document.getElementById(cell1).className;
  document.getElementById(cell1).className = document.getElementById(cell2).className;
  document.getElementById(cell2).className = temp;

}

function shuffle() {
  //Use nested loops to access each cell of the 3x3 grid
  for (var row = 1; row <= 3; row++) { //For each row of the 3x3 grid
    for (var column = 1; column <= 3; column++) { //For each column in this row

      var row2 = Math.floor(Math.random() * 3 + 1); //Pick a random row from 1 to 3
      var column2 = Math.floor(Math.random() * 3 + 1); //Pick a random column from 1 to 3

      swapTiles("cell" + row + column, "cell" + row2 + column2); //Swap the look & feel of both cells
    }
  }
}


function clickTile(row, column) {
  var cell = document.getElementById("cell" + row + column);
  var tile = cell.className;
  if (tile != "tile9-3x3") {
    //Checking if white tile on the right
    if (column < 3) {
      if (document.getElementById("cell" + row + (column + 1)).className == "tile9-3x3") {
        swapTiles("cell" + row + column, "cell" + row + (column + 1));
        return;
      }
    }
    //Checking if white tile on the left
    if (column > 1) {
      if (document.getElementById("cell" + row + (column - 1)).className == "tile9-3x3") {
        swapTiles("cell" + row + column, "cell" + row + (column - 1));
        return;
      }
    }
    //Checking if white tile is above
    if (row > 1) {
      if (document.getElementById("cell" + (row - 1) + column).className == "tile9-3x3") {
        swapTiles("cell" + row + column, "cell" + (row - 1) + column);
        return;
      }
    }
    //Checking if white tile is below
    if (row < 4) {
      if (document.getElementById("cell" + (row + 1) + column).className == "tile9-3x3") {
        swapTiles("cell" + row + column, "cell" + (row + 1) + column);
        return;
      }
    }
  }

}

//Completing the puzzle
function checkWin() {
  //Checks if all tiles are aligned in row 1
  var row1 = document.getElementById("row1");
  for (var i = 0; i < row1.children.length; i++) {
    var n = i + 1;
    if (row1.children[i].className != "tile" + n.toString() + "-3x3") {
      return false;
    }
  }
  //Checks if all tiles are aligned in row 2
  var row2 = document.getElementById("row2");
  for (var i = 0; i < row2.children.length; i++) {
    var n = i + 4;
    if (row2.children[i].className != "tile" + n.toString() + "-3x3") {
      return false;
    }
  }
  //Checks if all tiles are aligned in row 3
  var row3 = document.getElementById("row3");
  for (var i = 0; i < row3.children.length; i++) {
    var n = i + 7;
    if (row3.children[i].className != "tile" + n.toString() + "-3x3") {
      return false;
    }
  }
  return true;
}

var win = checkWin();
if (win == checkWin()) {
  $('#win-modal').modal('show');
  audio.rickAudio.play();
}

函数交换选项（单元1、单元2）{
var temp=document.getElementById（cell1）.className；
document.getElementById（cell1）.className=document.getElementById（cell2）.className；
document.getElementById（cell2）.className=temp；
}
函数shuffle（）{
//使用嵌套循环访问3x3网格的每个单元格
对于（变量行=1；行1）{
if（document.getElementById（“单元格”+（行-1）+列）.className==“tile9-3x3”）{
交换选项（“单元格”+行+列，“单元格”+（行-1）+列）；
返回；
}
}
//检查白色瓷砖是否在下方
如果（第4行）{
if（document.getElementById（“单元格”+（行+1）+列）.className==“tile9-3x3”）{
交换选项（“单元格”+行+列，“单元格”+（行+1）+列）；
返回；
}
}
}
}
//完成拼图
函数checkWin（）{
//检查第1行中的所有平铺是否对齐
var row1=document.getElementById（“row1”）；
for（变量i=0；i

如果看不到HTML，很难说，但我想您需要在

clickTile

函数中移动

checkWin

调用。每次单击后，您都要检查移动是否完成了拼图。此外，还可以删除

var-win=checkWin（）行，然后简单地说
如果（checkWin（））{…
…代码重复并修改了第2行和第3行的代码，我现在已经成功地对其进行了排序。