在迷宫墙上停止字符javascript

Question

我正在制作一个迷宫游戏，并且我正在为迷宫布局使用一张桌子。角色完美地移动，但它穿过墙壁对于墙壁，我使用的东西类似<td style="border-right:10px solid #000000;">。它的作品，但角色几乎是一个鬼。有没有办法让字符在达到border时停下来？我的迷宫在http://thomaswd.com/maze。

谢谢！

Answer 1

由于您使用的是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); 
} 

我希望这有助于

Answer 2

保存鼠标所在的单元格，然后当请求移动时，检查当前单元格是否在用户尝试去的方向上具有边界，或者未来单元格在相反方向上具有边界，如果有请移除移动请求。例如，如果用户点击右侧，请检查当前单元格是否有右边框，或鼠标移动的单元格是否有左边框。