Javascript "keypress"事件不起作用

Question

我是 JavaScript 新手，在使用“keypress”事件时遇到问题；我目前正在做一个小的跳跃脚本测试，“keydown”和“keyup”事件都起作用，但“keypress”不起作用(我尝试在事件发生后立即使用 console.log() 进行调试，但按下时没有任何显示一把 key )。

这是我的 window.onload 函数(我在其中添加事件监听器):

window.onload = function()
{
	canvas = document.getElementById('gameCanvas');
	ctx = canvas.getContext('2d');

	init();
	
	setInterval(function()
	{
		tick();
		render();
		
	}, 1000/FPS
	);
	
	// listeners
	window.addEventListener("keypress", function(evt)
	{
		if (evt.defaultPrevented)
		{
    		return;
  		}
  		switch(evt.keyCode)
  		{
  			case 38:
  				player.jump();
  			break;
  			default:
  			return;
  		}
	}
	);
	
	window.addEventListener("keydown", function(evt)
	{
		if (evt.defaultPrevented)
		{
    		return;
  		}
		switch(evt.keyCode)
		{
			case 37:
				player.moveLeft();
			break;
			case 39:
				player.moveRight();
			break;
			default:
			return;
		}
	}
	);
	
	window.addEventListener("keyup", function(evt)
	{
		if (evt.defaultPrevented)
		{
    		return;
  		}
		switch(evt.keyCode)
		{
			case 37:
			case 39:
				player.stop();
			break;
			default:
			return;
		}
	}
	);
}

感谢您的帮助!

Answer 1

keypress 事件涉及按下某个键产生的实际输入，而不是“按下”该键的实际物理过程。

我从您的代码中得知您对箭头键感兴趣。由于箭头键不会产生任何类型的字符，因此它们不会触发 keypress 事件。您需要使用 keydown 和 keyup 事件。

还有最后一点:即使对于同时触发 keydown 和 keypress 事件的按键，keyCode/which 属性在两个事件之间通常会有所不同，同样是因为一个事件涉及实际的 key ，另一个涉及生成的输入。 keyCode 和 which 实际上已被弃用，取而代之的是抽象的 key 字符串属性，该属性消除了不同事件之间的这种不一致。