Question

我在学习15个益智游戏的动作时遇到了问题。我需要空白的瓷砖能够向上和向下左右移动，除非它接触到当然的两侧。我手边有一些代码，但我需要帮助我的动作和实现游戏状态的想法，如果没有按时完成重启游戏是我的想法，但我没有忘记如何开始。

目前，我需要有关机芯的帮助，并且只使用我应用于我的代码的技术。没有jQuery或类似的东西。只是基本的，java，html表和CSS来改变外观，但我可以毫无问题地做到这一点。我不是一个主要的编码器，这是为了做作业，说实话，我不是那么Javascript友好，我主要在3D建模，所以你了解我的专业知识。这是代码：

 var bposr =3; // blank position : row
    var bposc=3;  // blank position : column


    function keypress() {
    var ieKey = event.keyCode;

    
       
            if (ieKey == 40 && bposr!=0){ // for moving down
            temp= 
    document.getElementById("myTable").rows[bposr1].cells[bposc].innerHTML;
          
    document.getElementById("myTable").rows[bposr1].cells[bposc
    ].innerHTML=document.getElementById("myTable").rows[bposr
    ].cells[bposc].innerHTML;
        
     document.getElementById("myTable").rows[bposr].cells[bposc].innerHTML=temp;
        document.getElementById("myTable").rows[bposr].cells[bposc
    ].style.backgroundColor='#DCDCDC';
       document.getElementById("myTable").rows[bposr1
    ].cells[bposc].style.backgroundColor='#ffffff';
        bposr--;
       }

        else if (ieKey == 37 && bposc!=1){  // for moving right
            temp= 
     document.getElementById("myTable").rows[bposr].cells[bposc+1].innerHTML;
        document.getElementById("myTable").rows[bposr].cells[bposc+1
    ].innerHTML=document.getElementById("myTable").rows[bposr
    ].cells[bposc].innerHTML;
        
    document.getElementById("myTable").rows[bposr].cells[bposc].innerHTML=temp;
        document.getElementById("myTable").rows[bposr].cells[bposc
    ].style.backgroundColor='#DCDCDC';
       document.getElementById("myTable").rows[bposr].cells[bposc+1
    ].style.backgroundColor='#ffffff';
        bposc++;
    
        }
        
	    else if (ieKey == 39 && bposc!=1){  // for moving left
            temp= 
        document.getElementById("myTable").rows[bposr].cells[bposc+1].innerHTML;
        document.getElementById("myTable").rows[bposr].cells[bposc+1
        ].innerHTML=document.getElementById("myTable").rows[bposr
        ].cells[bposc].innerHTML;
        
        document.getElementById("myTable").rows[bposr
        ].cells[bposc].innerHTML=temp;
        document.getElementById("myTable").rows[bposr].cells[bposc
        ].style.backgroundColor='#DCDCDC';
        document.getElementById("myTable").rows[bposr].cells[bposc+1
        ].style.backgroundColor='#ffffff';
        bposc++;
    
    }
        
    else if (ieKey == 38 && bposr!=0){ // for moving down
            temp= document.getElementById("myTable").rows[bposr-
    1].cells[bposc].innerHTML;
        document.getElementById("myTable").rows[bposr-
    1].cells[bposc].innerHTML=document.getElementById("myTable").rows[bposr
    ].cells[bposc].innerHTML;
        
    document.getElementById("myTable").rows[bposr].cells[bposc].innerHTML=temp;
        document.getElementById("myTable").rows[bposr].cells[bposc
    ].style.backgroundColor='#DCDCDC';
        document.getElementById("myTable").rows[bposr-
    1].cells[bposc].style.backgroundColor='#ffffff';
        bposr--;
       }
        
       }

        function start(){
                    document.onkeydown = keypress;
                    }

    table, td {
        border:  solid black;
        text-align: center;
        background-color: #DCDCDC;
    } 

    td {
        width: 20px;
    
    }

    <body onLoad="start()">
    <center>
    <table id="myTable">
  
  
      <tr>
        <td>1</td>
        <td>2</td>
        <td>3</td>
        <td>4</td>
      </tr>
  
      <tr>
        <td>5</td>
        <td>6</td>
        <td>7</td>
        <td>8</td>
      </tr>
  
      <tr>
        <td>9</td>
        <td>10</td>
        <td>11</td>
        <td>12</td>
      </tr>
  
      <tr>
       
        <td>13</td>
        <td>14</td>
        <td>15</td>
        <td style="background-color:white;"></td>
      </tr>
    </table>
    <br>

需要帮助实现我的运动与左下方向上和向上箭头键15益智游戏

0 个答案: