使用按键jquery限制键盘输入

我有一个按键function,我用游戏创建了一个带有输入按钮的表单中的用户输入(并且我按照按下的Enter键顺序执行了我定义的一系列function)。

$(".form-control").keypress(function(event) { var keycode = (event.keyCode ? event.keyCode : event.which); if (keycode == 13) { var space = $(this).val().toLowerCase(); if (!(wrongGuesses.indexOf(space) > -1 || rightGuesses.indexOf(space) > -1)) { play(space); $(this).val(''); endGame(); return false; } else window.alert("You already guessed this letter."); } }); 

这很棒。 但是,现在,我试图限制用户只能输入字母而且一次只能输入一个字母 – 我想限制除单个字母以外的任何内容然后输入然后保持我的按键事件链在那之后输入密钥 – 我尝试过这样的事情:

  $(".form-control").keypress(function(event) { var keycode = (event.keyCode ? event.keyCode : event.which); if (!(keycode >= 65 && keycode  65 && keycode  -1 || rightGuesses.indexOf(space) > -1)) { play(space); $(this).val(''); endGame(); return false; } else window.alert("You already guessed this letter."); } // } }); 

这不起作用(我觉得语法错了)&它弄乱了我的游戏function; 然后我试过:

 $(".form-control").keypress(function(event) { var keycode = (event.keyCode ? event.keyCode : event.which); if (keycode == 13) { var space = $(this).val().toLowerCase(); if (!(wrongGuesses.indexOf(space) > -1 || rightGuesses.indexOf(space) > -1)) { play(space); $(this).val(''); endGame(); return false; } else if (keycode  13 && keycode  90){ event.preventDefault(); } else window.alert("You already guessed this letter."); } }); 

这也没用。 我还尝试创建另一个函数,只是将输入限制为与输入键function分开的字母,这些输入键与游戏相关联,这也不起作用/导致输入不触发这些事件(或我的游戏不显示猜测如果(键码> 65 ||键码<90)也导致游戏或显示错误而且我不确定我应该如何处理这个问题,那么只是制作一个条件语句或将正确的猜测注册为错误的猜测我整天尝试了很多不同的方法,但没有用,有些建议/建议真的很值得赞赏。 如果你需要了解整个游戏是如何工作的,这里是我的小提琴的链接: https : //jsfiddle.net/KindeR99/wuftst3t/

编辑**:我已经尝试了.alpha()jquery插件(虽然我想找到一个原生的JS / jquery解决方案)这对我来说也不起作用(但我可能没有使用过它)对)。 我不确定为什么这些解决方案都不起作用/不限制输入或搞乱我的游戏function。 我也试过这种方法w / reg表达式:

  $(".form-control").keypress(function(event) { var keycode = (event.keyCode ? event.keyCode : event.which); if (keycode == 13) { var space = $(this).val().toLowerCase(); if (!(wrongGuesses.indexOf(space) > -1 || rightGuesses.indexOf(space) > -1) || space.length !== 1 || !space.match(/[az]/)) { play(space); $(this).val(''); endGame(); return false; } else window.alert("That's restricted."); } }); 

这只是限制输入的键码:

 $(".form-control").keypress(function(event) { var keycode = (event.keyCode ? event.keyCode : event.which); if (keycode > 65 || keycode  -1 || rightGuesses.indexOf(space) > -1)) { play(space); $(this).val(''); endGame(); return false; } else window.alert("You already guessed this letter."); } else { event.preventDefault(); } }); 

但他们都搞砸了我的游戏或游戏function的html显示(我不确定哪种方法可以解决这个问题,这对我游戏的function影响最小)。 输入只是在输入之后输入并不是那么重要 – 我只是希望能够保持游戏function的原样而且我不确定要解决这个问题的道路 – 如果我知道哪种方法是最好的正确地做到这一点的方法,我可以专注于该方法并尝试进行更深入的调试。 谢谢!

有两件事可以帮助你改善游戏:

  1. 要在文本框中添加最大输入长度,请使用maxlength属性。

  2. 要仅限制字母输入并防止空字符串猜测,请将以下内容添加到您的(".form-control").keypressfunction

 var keycode = event.keyCode ? event.keyCode : event.which; if ((keycode < 64 || keycode > 91) && (keycode < 96 || keycode > 123) && keycode !== 13) return false; if (keycode == 13) { var space = $(this).val().toLowerCase(); if (space == '') { window.alert("Please enter a letter to guess.") return false; } if (wrongGuesses.indexOf(space) > -1 || rightGuesses.indexOf(space) > -1) { play(space); $(this).val(''); endGame(); return false; } else window.alert("You already guessed this letter."); } 

$ .restrict()正是出于此目的。