HTML 输入不允许数字
声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow
原文地址: http://stackoverflow.com/questions/29823591/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
HTML input do not allow numbers
提问by b-m-f
Right now I have an input field like this:
现在我有一个这样的输入字段:
<input class="form-control" type="text"/>
But it stills allows the input of numbers.
但它仍然允许输入数字。
I want names to be input and want to display an error message when the string contains a number. How can I achieve this?
我希望输入名称并希望在字符串包含数字时显示错误消息。我怎样才能做到这一点?
回答by Mior
You can use native HTML5 field validation
您可以使用原生HTML5 字段验证
like e-mail validation (fiddle):
<input type="text" title="email" pattern="[^@]+@[^@]+\.[a-zA-Z]{2,6}" />
像电子邮件验证(小提琴):
<input type="text" title="email" pattern="[^@]+@[^@]+\.[a-zA-Z]{2,6}" />
For your specific case you can use regexp like pattern="[a-zA-Z]*"
(fiddle)
对于您的特定情况,您可以使用正则表达式pattern="[a-zA-Z]*"
(fiddle)
When you submit form it became highlighted with red border to show you validation error. In different browser it will behave slightly different.
当您提交表单时,它会以红色边框突出显示以显示验证错误。在不同的浏览器中,它的行为会略有不同。
I don't think there is standard way to override every default styling, however there are browser specific ways to do this (here).
我认为没有覆盖每个默认样式的标准方法,但是有浏览器特定的方法可以做到这一点(这里)。
For some style you can have css hooks in place for changes see here
对于某些样式,您可以使用 css hooks 进行更改,请参见此处
Edit: updated fiddle.
编辑:更新小提琴。
回答by Ash Win
This should help you to type only characters:
这应该可以帮助您只输入字符:
$(function() {
$('#txtNumeric').keydown(function (e) {
if (e.shiftKey || e.ctrlKey || e.altKey) {
e.preventDefault();
} else {
var key = e.keyCode;
if (!((key == 8) || (key == 32) || (key == 46) || (key >= 35 && key <= 40) || (key >= 65 && key <= 90))) {
e.preventDefault();
}
}
});
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div>
<b>Enter Text:</b>
<input type="text" id="txtNumeric" />
</div>
回答by Patrick
You have several options....
你有几个选择......
Regardless of the options, you will be using regular expressions in some way shape or form.
无论选项如何,您都将以某种形式或形式使用正则表达式。
You can do it on the client side using JavaScript
...
您可以在客户端使用JavaScript
...
function Validate () {
var inputValue = document.getElementById("test").value;
var reg = new RegExp('^\d+$');
var test = reg.test(inputValue);
//--Do something with test--
console.log(test);
}
<input id="test" class="form-control" type="text" />
<button onClick="Validate()">Validate</button>
If it is just plain HTML
with no server side code you will need to use JavaScript
.
如果它只是简单HTML
的没有服务器端代码,您将需要使用JavaScript
.
EDIT
编辑
And as far as I know this is supported in all browsers that support JavaScript
regardless of version.
据我所知,JavaScript
无论版本如何,所有支持的浏览器都支持这一点。
回答by Pavel Ku?era
no input alows just text:
没有输入只允许文本:
http://www.w3schools.com/html/html_form_input_types.asp
http://www.w3schools.com/html/html_form_input_types.asp
... you can try js + action on input like onkeydown
...你可以尝试 js + action on input like onkeydown
http://www.w3schools.com/jsref/event_onkeydown.asp
http://www.w3schools.com/jsref/event_onkeydown.asp
and validate by regEx (just letters)
并通过正则表达式验证(只是字母)
can better control what happens when good or bad validation. Only the alert or change color etc.
可以更好地控制验证好坏时发生的情况。只有警报或改变颜色等。