Question

希望有人可以帮助我。我用html5 / javascript制作游戏，我希望用户能够使用箭头键移动地图，并在玩家点击画布时执行一些代码。我有所有工作正常但由于某些原因，有时当用户单击画布时，keydown侦听器停止工作，除非他们再次单击画布外部。我试图谷歌它似乎是我想设置代表团来解决它，但我很难让它工作。这是我目前的代码：

$(window).keydown(function(event){keyDown(event);});

$("#game").click(function(e){
    var x = e.pageX - $(this).offset().left;
    var y = e.pageY - $(this).offset().top;
    alert(x+" "+y);
});

非常感谢任何帮助。

Answer 1

我猜你的标签没有得到事件，因为它没有焦点？

这是一个在我的环境中工作的解决方案。要使div标签可以通过它传递tabindex =“0”属性。

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html>
    <head>
          <script type="text/javascript">
            function xxx() {
              var div  = document.getElementById('x');
              div.focus();
            }
            function keyd(e) {
            alert("DDDDDDDD" + e );
            }
            </script>

    </head>
    <body onload="xxx();">
          <div tabindex="0" id='x' onkeydown="keyd(event);" style="background-color: green; width: 100px; height: 100px;">            
            </div>
    </body>
</html>

Answer 2

我把你的代码放在jsFiddle中，它似乎每次都有效：http://jsfiddle.net/ianoxley/fb26Y/

只是想知道您正在使用哪种浏览器/操作系统？您的keyDown事件处理程序中调用的keydown函数会发生什么？

单击后，Javascript keydown侦听器无法正常工作

2 个答案: