如何避免在html中输入字母？ [复制]
Posted
技术标签:
【中文标题】如何避免在html中输入字母？ [复制]【英文标题】：how to avoid typing letters in html? [duplicate] 【发布时间】：2014-08-04 00:23:15 【问题描述】：我们如何避免在 html 标签中输入字母或数字？我们还需要在 php 中创建代码块来避免它吗？或者我们可以像这样通过 html 禁用它：
<input type="text" />
我们可以改成这样吗？
<input type="number" />
这样，如果您按任何字母，字母就不会出现。
<body>
<table>
<tr>
<td>this is for text</td><td><input type="text" size="5" maxlength="5"></td>
<td>this for numbers</td><td><input type="number" size="5" maxlength="5"></td>
</tr>
</table>
</body>
有什么想法吗？ 我应该把 javascript 放在哪里？
【问题讨论】：
是的，你可以。就像你建议的那样。 是的，但是您总是需要重新验证服务器上的数据，因为标记不能保证任何事情。 我的意思是，当你在键盘上按字母时它不会显示出来。在我的示例中，用户可以输入任何字符。 @user3737597 这取决于您使用的浏览器。如果您希望它在跨浏览器中发挥相同的作用，您需要使用一些 javascript（并且仍然在服务器端验证它） 有什么方法可以禁用输入字母吗？可以举个例子吗？ 【参考方案1】：您可以在 SUBMIT 上对数字使用此验证：
pattern="[0-9]10"
10这里最多允许10个数字
查看 Regex 备忘单了解更多信息：
link
或者这里是通过 javascript 验证的方式，无需提交：
<input type='text' onkeypress='validate(event)' />
function validate(evt)
var theEvent = evt || window.event;
var key = theEvent.keyCode || theEvent.which;
key = String.fromCharCode( key );
var regex = /[0-9]|\./;
if( !regex.test(key) )
theEvent.returnValue = false;
if(theEvent.preventDefault) theEvent.preventDefault();
为用户编辑（按回车检查数字）：
<input type="text" id="txtTextBox" />
$('#txtTextBox').keypress(function(event)
var regex = /[0-9]|\./;
var text = $("input[type=text]").val();
var keycode = (event.keyCode ? event.keyCode : event.which);
if(keycode == '13' && !(regex.test(text)))
alert('You pressed a "enter" key in textbox');
);
Jsfiddle：
link
【讨论】：
明白了！但是如何将 ENTER 键添加到该 [0-9] 值？ 回车键是什么意思？你到底想做什么？ 我想要的是当我在文本字段中输入数字并按 Enter 时，它会自动发送我输入的数字。我只想启用“ENTER KEY”，因为在这个例子中它只允许按下数字而不是“ENTER KEY” 这是你的 jsfiddle：jsfiddle.net/RC78z/105 如果对你有帮助请点个赞【参考方案2】：您可以绑定按键事件处理程序并使用客户端脚本检查按键代码。返回false 将阻止输入。以下是javascript中的示例
element.onkeypress(function(e)
var keycode = e.which;
/* 48-57: 0 -9
8:backspace */
if((keycode >= 48 && keycode <= 57) || keycode == 8 )
return true;
return false;
);
【讨论】：
我有这个代码 @user3737597 抱歉，我没听懂你……？ 对不起，我不小心按了回车...我把你的代码@T J 放在哪里？ 在 【参考方案3】：<input type="number" /> 完全有效。但是，它仍然允许用户输入字母。这是一个使用 jQuery 的解决方案：
$("#myInput").keydown(function(e)
if(((e.keyCode < 48) || (e.keyCode > 57))&& e.keyCode != 8)
e.preventDefault();
);
小提琴：http://jsfiddle.net/yC7un/1/
如果您不使用 jQuery，请使用以下“香草”JS：
document.getElementById("myInput").onkeydown=function(e)
if(((e.keyCode < 48) || (e.keyCode > 57))&& e.keyCode != 8)
return false;
return true;
;
小提琴：http://jsfiddle.net/yC7un/2/
【讨论】：
对不起，我对 jQuery 不太熟悉，我们可以用 php 制作吗？ PHP 是服务器端的。 PHP 可以不阻止用户输入字母。 @user3737597 我刚刚用非 jQuery 解决方案更新了我的答案。【参考方案4】：某些浏览器仍允许输入字母，但不会在表单提交时进行验证。 正如科尔伯顿所说，您的建议是最正确的方法。
您可以制作一个 javascript onkeydown-function 来检查用户的输入并覆盖它。
【讨论】：
【参考方案5】：使用模式。
对于字母：
<input type="text" pattern="[A-Za-z]" />
数字
<input type="text" pattern="[0-9]" />
仅适用于 HTML5 和输入类型“文本、搜索、url、电话、电子邮件和密码”，对于较旧的浏览器，您应该使用 JS/jQuery。
【讨论】：
您仍然可以在此处键入任何内容。它只是没有验证。 我忘了它在提交时验证，那么你最好的选择是 JS以上是关于如何避免在html中输入字母？ [复制]的主要内容，如果未能解决你的问题，请参考以下文章
如何避免 keyPress 方法使我的绘图在处理 3 中永久化？