0

私は 15 個のスライダー パズルの Javascript バージョンを作成しており、innerHTML 値を交換することでタイルの「移動」をシミュレートできます。他の人が示唆しているように、配列の代わりにも使用しています。私のコードを考えると、パズルが解けたかどうかを確認する方法を入力するにはどうすればよいでしょうか? 解決したら「解決しました！」でアラートしてほしいです。私にできるメッセージ。パズルが実際に解かれているかどうかを確認する方法がわかりません。

条件付きの if ステートメント (つまり、空白セルが行 3、セル 3 にある場合) を使用してアラート ポップアップを表示することを考えていましたが、すぐに失敗しました。また、各行に 1 ～ 15 が正しい順序で含まれているかどうかもチェックしません。最初は、2 つのタイルを入れ替えてパズルを開始します。これが私がこれまでのところです：

<!DOCTYPE HTML PUBLIC "-//IETF//DTD HTML//EN">
<html> <head>
<title>15 puzzle</title>
<style>
 td {
     border: 1px solid blue;
     width: 30px;
     height: 30px;
     text-align: center;
     vertical-align: middle;
}
 td:hover {
 background-color: yellow;
}
</style>
<script>
var blank_row = 3;
var blank_col = 3;
var puzzle = document.getElementById("puzzle");

function f(e) {
    var my_row = e.parentElement.rowIndex;
    var my_col = e.cellIndex;

if ((blank_col == my_col &&
    Math.abs(blank_row - my_row) == 1)  
    ||  
    (blank_row == my_row &&
    Math.abs(blank_col - my_col) == 1)) {
     var e2 = document.getElementById("puzzle").rows[blank_row].cells[blank_col];
         e2.innerHTML = e.innerHTML;
          e.innerHTML = " ";
            blank_row = my_row;
            blank_col = my_col;

  }

}
</script>
</head>

<body>
<table id="puzzle">
<tr>
   <td onclick="f(this)">1</td>
   <td onclick="f(this)">6</td>
   <td onclick="f(this)">3</td>
   <td onclick="f(this)">4</td>
  </tr>
<tr>
   <td onclick="f(this)">5</td>
   <td onclick="f(this)">10</td>
   <td onclick="f(this)">7</td>
   <td onclick="f(this)">8</td>
  </tr>
<tr>
   <td onclick="f(this)">9</td>
   <td onclick="f(this)">2</td>
   <td onclick="f(this)">11</td>
   <td onclick="f(this)">12</td>
  </tr>
 <tr>
   <td onclick="f(this)">13</td>
   <td onclick="f(this)">14</td>
   <td onclick="f(this)">15</td>
   <td onclick="f(this)"> </td>
  </tr>
   </table> 
 </body>
 </html>
4

1 に答える 1

0

ここで単一の配列を使用しているのか、2D 配列を使用しているのかがはっきりしないので、それぞれについて回答します。どちらの場合も、0-indexing を想定しています。

単一アレイ: 以下を確認しcells[i] = i + 1ます。

function checkSolved() {
    for (i = 0; i < 15; i++) {
        if (cells[i] != i + 1) { return false; }
    }
    return true;
}

...

if (checkSolved()) { alert("Solved!"); }

必要がないため、最後のセルをチェックしていないことに注意してください。

2D 配列:を確認しますcells[i][j] = 4 * i + j + 1。ここiで、 は行、jは列です。

function checkSolved() {
    for (i = 0; i < 4; i++) {
        upperCol = (i < 3 ? 4 : 3); // Skip last cell
        for (j = 0; j < upperCol; j++) {
            if (cells[i][j] != (4 * i + j + 1)) { return false; }
        }
    }
    return true;
}

...

if (checkSolved()) { alert("Solved!"); }

私の Javascript は強力ではないため、正確な構文が間違っている可能性がありますが、それが論理です。

于 2014-10-05T05:12:01.800 に答える