Question

我正在制作迷宫游戏，我正在使用桌子进行迷宫布局。角色完美无瑕地移动，但穿过墙壁对于墙壁，我使用<td style="border-right:10px solid #000000;">之类的东西。它有效，但角色几乎是幽灵。有没有办法让角色在到达border时停止？我的迷宫位于http://thomaswd.com/maze。

Answer 1

保存鼠标所在的单元格，然后在请求移动时，检查当前单元格是否在用户尝试前进的方向上有边框，或者未来单元格在相反方向上是否有边框，并且如果有的话，只是中止移动请求。例如，如果用户单击右侧，请检查当前单元格是否具有右边框，或者鼠标将移动到的单元格是否具有左边框。

Answer 2

由于您正在使用jQuery，并且单元格中的类显示了墙，您可以使用jQuery的hasClass方法检查您尝试移动的单元格是否有墙。

function up() {
    //check if the cell has a border on the bottom
    if ($("#td" + (algernon - 8)).hasClass('b')) return;
    $("td").css("background","transparent");
    algernon -= 8;
    setTimeout("refresh()", 0);
}

function down() {
    //check if the cell has a border on the top
    if ($("#td" + (algernon + 8)).hasClass('t')) return;
    $("td").css("background","transparent");
    algernon += 8;
    setTimeout("refresh()", 0);
}

function leftclick() {
    //check if the cell has a border on the right
    if ($("#td" + (algernon - 1)).hasClass('r')) return;
    $("td").css("background","transparent");
    algernon -= 1;
    setTimeout("refresh()", 0);
}

function rightclick() {
    //check if the cell has a border on the left
    if ($("#td" + (algernon + 1)).hasClass('l')) return;
    $("td").css("background","transparent");
    algernon += 1;
    setTimeout("refresh()", 0);
}

我希望这会有所帮助

在迷宫墙Javascript停止角色

2 个答案: