如何防止用户使用 Javascript 输入特定密钥
[英]How to prevent user to enter specific key using Javascript
问题描述
I have a text field and I want to allow only alphabet.
我有一个文本字段，我只想允许字母表。 So I write the below Javascript method to prevent other keys.所以我写了下面的 Javascript 方法来防止其他键。 Unfortunately my text field is allowing uparrow(^).不幸的是，我的文本字段允许向上箭头（^）。 Can any one tell me how to restrict uparrow(^) ?谁能告诉我如何限制 uparrow(^) ？
function onlyAlphabet(evt) {
var theEvent = evt || window.event;
var key = theEvent.keyCode || theEvent.which;
var keychar = String.fromCharCode(key);
var keycheck = /[a-zA-z\s]/;
if (!(key == 8 || key == 27 || key == 46 || key == 9 || key == 39)) // backspace delete escape arrows
{
if (!keycheck.test(keychar)) {
theEvent.returnValue = false;//for IE
if (theEvent.preventDefault)
theEvent.preventDefault();//Firefox
}
}
}
html code html代码
<div class="form-group">
<label class="form-text">Travels Name</label>
<h:inputText value="#{bean.travelName}" maxlength="50" onkeypress="return onlyAlphabet(event)" />
</div>
6 个解决方案
解决方案1
2 已采纳 2017-03-29 09:27:48
You can achieve that in a more simpler way like the following:您可以通过更简单的方式实现这一点，如下所示：
function onlyAlphabet(inputVal) { var patt=/^[a-zA-Z]+$/; if(patt.test(inputVal)){ document.getElementById('txtTravel').value = inputVal; } else{ var txt = inputVal.slice(0, -1); document.getElementById('txtTravel').value = txt; } }
<div class="form-group"> <label class="form-text">Travels Name</label> <input id="txtTravel" type="text" maxlength="50" oninput="onlyAlphabet(value)" /> </div>
解决方案2
1 2017-03-29 09:01:49
<!DOCTYPE html> <html> <head> <title></title> <meta charset="utf-8" /> <script> function onlyAlphabet(evt) { var theEvent = evt || window.event; var key = theEvent.keyCode || theEvent.which; var keychar = String.fromCharCode(key); var keycheck = /[a-zA-z\\s]/; if (!(key == 8 || key == 27 || key == 46 || key == 9 || key == 39 || key == 94)) // backspace delete escape arrows { if (!keycheck.test(keychar)) { theEvent.returnValue = false;//for IE if (theEvent.preventDefault) theEvent.preventDefault();//Firefox } } else if(key==94) theEvent.preventDefault(); } </script> </head> <body> <input id="Text1" type="text" onkeypress="return onlyAlphabet(event)"/> </body> </html>
Keycode for ^ is 94 .. Prevent it.. If you want to fix it yourself put alert(key) in the code, where you will get the code for the pressed key. ^ 的键码是 94 .. 防止它.. 如果您想自己修复它，请将 alert(key) 放在代码中，您将在其中获得按下键的代码。
解决方案3
0 2017-03-29 09:12:28
The most elegant way (not supported in Safari) is to use the pattern attribute of the input element.最优雅的方式（Safari 不支持）是使用input元素的pattern属性。
<input pattern="[A-Za-z\s\^]+" type="text" />
Oh, you mean the ^ itself?哦，你是说 ^ 本身？ :))) :)))
It is enough to update your regular expression:更新你的正则表达式就足够了：
var keycheck = /[a-zA-z\s\^]/;
解决方案4
0 2017-03-29 09:13:26
Using jQuery, simple & elegant :使用 jQuery，简单而优雅：
jQuery('#id').on('keypress', limitChars);
function limitChars(e){
return event.charCode >= 97 && event.charCode <= 122;
}
解决方案5
0 2018-05-30 10:48:20
You should try to block only the specific key you don't want.您应该尝试仅阻止您不想要的特定键。 So keypress event get the pressed key before this character enter in your input.因此keypress事件在此字符输入您的输入之前获取按下的键。 You also can use event.preventDefault() to block this specific key you don't want.您还可以使用event.preventDefault()来阻止您不想要的特定键。
I'll show you a good example of how this could be done using jQuery.我将向您展示一个很好的示例，说明如何使用 jQuery 完成此操作。
$("input[name='yourinput']").keypress(function(event) {
if ( event.keyCode == 94 ) {
event.preventDefault();
}
});
解决方案6
0 2021-06-08 21:07:58
This also works这也有效
<div class="form-group">
<label class="form-text">Travels Name</label>
<h:inputText value="#{bean.travelName}" maxlength="50" onkeypress="/[a-zA-Z]/.test(event.key) || event.preventDefault()" />
</div>
声明:本站的技术帖子网页，遵循CC BY-SA 4.0协议，如果您需要转载，请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.